对 jQuery 代码进行故障排除以更改 CSS onclick



这是我第一次完全从头开始编写一些jQuery代码,所以除了我在某处出错的事实之外,我也不确定这是否是做我想做的事情的最佳方式。 来了!

我正在使用jQuery Swipe.js来控制移动网站上的滑块。滑块包含 3 个div。我还有一些左右箭头按钮,用户可以单击这些按钮来调用滑动功能。

我想在调用滑动操作时隐藏/显示一些div,具体取决于视口中当前的内容。我尝试使用一个简单的变量 i 来做到这一点,根据用户正在查看的当前页面添加/减去该变量。

调用滑动.js函数的原始脚本只是var slider = new Swipe(document.getElementById('slider'));

我编写的脚本代码是这样的://EDIT:在查看滑动文档后更新

var slider = new Swipe(document.getElementById('slider'), {
      callback: function() {
        var pageNumber = slider.getPos();
        if (pageNumber = 0) {
            $(".leftArrow").css("display", "none");
            $("footer#about").css("display", "none");       
            $("footer#adFooter").css("display", "none");
        }
        else if (pageNumber = 1) {
            $(".leftArrow").css("display", "inline");
            $("footer#adFooter").css("display", "inline");          
            $("footer#about").css("display", "none");
        }
        else if (pageNumber = 2) {
            $("footer#adFooter").css("display", "none");        
            $("footer#about").css("display", "inline");
        }     
    }
});

HTML 代码是这样的:

<a href='#' onclick='slider.prev(); return false;'><img class="leftArrow" src="img/arrow_right.png" alt="Left Nav Arrow"/></a>
<a href='#' style="" onclick='slider.next(); return false;'><img class="rightArrow" src="img/arrow_right.png" alt="Right Nav Arrow"/></a>

无法确切地看到我在这里出错的地方,但显然整个事情不起作用。思潮?

你没有说你遇到了什么问题,但有一个问题很清楚。 i既可以是-1的,也可以是3的。 将两个 if 语句更改为表示i>0i<2,并且不要像现在这样包含=

最新更新