Bxslider插件在第一次"动作"后停止工作

Question

我正在处理这个网站的一些问题.

我正在使用Bxslider插件为项目页面创建一种投资组合但是它出了问题:

单击缩略图或方向箭头后,滑块不再起作用,我无法更改显示的图片.

我试过转换我的html标记的位置,但它没有做任何新的事情.

所以,这是我的HTML

<link rel="stylesheet" type="text/css" href="css/jquery.bxslider.css" />
            <ul class="portfolio">
                <li><img src="img/portfolio/projetos3d/1.jpg"></li>
                <li><img src="img/portfolio/projetos3d/2.jpg"></li>
                <li><img src="img/portfolio/projetos3d/3.jpg"></li>
                <li><img src="img/portfolio/projetos3d/7.jpg"></li>
                <li><img src="img/portfolio/projetos3d/8.jpg"></li>
            </ul>
            <div class="thumbs">
                <a data-slide-index="0" href=""><img src="img/portfolio/projetos3d/1.jpg"></a>
                <a data-slide-index="1" href=""><img src="img/portfolio/projetos3d/2.jpg"></a>
                <a data-slide-index="2" href=""><img src="img/portfolio/projetos3d/3.jpg"></a>
                <a data-slide-index="3" href=""><img src="img/portfolio/projetos3d/7.jpg"></a>
                <a data-slide-index="4" href=""><img src="img/portfolio/projetos3d/8.jpg"></a>
            </div>
        </div>

这里是js

<script src="js/jquery.bxslider.min.js"></script>
<script>
    $(document).ready(function(){
        $('.portfolio').bxSlider({
            pagerCustom: '.thumbs'
        });
    });
</script>

我不明白为什么会这样.

一点额外的手会非常感激.

这是一个演示,如果你想看到它工作(或不工作......)

感谢您的时间

编辑:尝试将下载的.js替换为他们在网站上使用的那个.我想也许它有点被窃听,但我错了,它仍然不起作用.

编辑2:我也尝试将脚本切换到html之前,但正如预期的那样,它没有改变一件事.

Answer 1

我发现了问题所在.

我在所有内容上使用了这些行,以便更快地向按钮和内容添加过渡.

*{
    -webkit-transition: color 0.2s linear, background 0.2s linear, border 0.2s linear;
       -moz-transition: color 0.2s linear, background 0.2s linear, border 0.2s linear;
         -o-transition: color 0.2s linear, background 0.2s linear, border 0.2s linear;
            transition: color 0.2s linear, background 0.2s linear, border 0.2s linear;
}

事实证明他们正在窃听滑块.