小编Dro*_*ops的帖子

循环通过img元素并随机应用幻灯片效果(向上,向下,向左,向右)

我有以下代码,我循环通过img元素,并希望随机应用slideUp(), slideDown(), slideLeft()slideRight()效果:

    var sliderEffects = ["slideUp", "slideDown", "slideLeft", "slideRight"];
    function slideLeft(){
        console.log("slide left");
    }
    function slideLeft(){
        console.log("slide right");
    }
    function randomFrom(items) {
        return items[Math.floor(Math.random()*items.length)];
    }
    // console.log(randomFrom(effects));
    $c.each(function(){
        $(this).find('img:gt(0)').hide();

        setInterval(function () {           
            $(this).find(':first-child')
             [randomFrom(sliderEffects)]()
             .next('img')
             .fadeIn()
             .end()
             .appendTo(this)
         }.bind(this), 3000 + Math.random()*4000); // 4 seconds
    });
Run Code Online (Sandbox Code Playgroud)

slideUp()slideDown()它工作得很好,因为它们是jQuery方法.当我尝试调用我的方法时会出现问题:slideLeft()slideRight().我尝试扩展元素对象以添加我的属性:

jQuery.fn.extend({
      slideLeft: function() {
            console.log("slide left");
      },
      slideRight: function() {
            console.log("slide right");
      },
    });
Run Code Online (Sandbox Code Playgroud)

那么,关于如何随机执行不同回调的任何想法?

javascript jquery

5
推荐指数
1
解决办法
147
查看次数

标签 统计

javascript ×1

jquery ×1