首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >重置bxSlider

重置bxSlider
EN

Stack Overflow用户
提问于 2011-05-01 06:58:24
回答 9查看 43.1K关注 0票数 4

我采取了不同的方向,我实现了一个转盘,选择了bxSlider而不是jCarousel。这是我正在构建的http://rjwcollective.com/equinox/rishi_gallery/eqgall.php图片库

我遇到的问题是,当我重置滤镜,或选择一个不同的滤镜时,滑块无法重置。这是初始加载的代码:

代码语言:javascript
复制
    //first load
$.ajax({
    type:"POST",
    url:"sortbystate.php",
    data:"city=&gender=&category=",
    success:function(data){
            //carousel

            $('#thumbs').html(data);


            //alert("whoa, careful there!");
                 $('#thumbs').bxSlider({auto: false, mode:'vertical',
                            autoControls: false,
                            autoHover: true,
                            pager: false,
                            displaySlideQty: 4,
                            speed:800,
                            infiniteLoop: true,      
                            moveSlideQty: 4,

                            controls: true});
    }

});//end ajax

以下是处理过滤器更改的代码:

代码语言:javascript
复制
$(".statelist :input").click(function(){

    var carousel = $('#thumbs').data('jcarousel');  
    var state = $('.statelist input:checked').attr('value');
    var gender = $('.gender input:checked').attr('value');
    var category =$('.category input:checked').attr('value');
        $.ajax({
            type:"POST",
            url:"sortbystate.php",
            data:"city="+state+"&gender="+gender+"&category="+category,
            success:function(data){
                    //alert("whoa, careful there!");

                    $('#thumbs').html(data);
                         $('#thumbs').bxSlider({auto: false, mode:'vertical',
                                    autoControls: false,
                                    autoHover: true,
                                    pager: false,
                                    displaySlideQty: 4,
                                    speed:800,
                                    infiniteLoop: true,      
                                    moveSlideQty: 4,

                                    controls: true});


                    //$('#thumbs').jcarousel('add', index, data);
            }


        });//end ajax
    });

我参考了bxSlider的文档,它有一个内置的函数来处理重置: destroyShow():function()

reloadShow():函数()

我对我做错了什么感到困惑。甚至尝试在加载数据之前清空carousel div,使用.empty(),没有骰子。

有什么想法?

编辑:指向bxSlider网站的链接:http://bxslider.com/

EN

回答 9

Stack Overflow用户

回答已采纳

发布于 2012-01-12 22:27:39

在文档就绪块外部声明"mySlider“变量为我解决了这个问题:

代码语言:javascript
复制
var mySlider;
$(function(){
    mySlider= $('#slider').bxSlider({
        auto: true,
        controls: true
    });

    mySlider.reloadShow();
})

亚历克斯

票数 13
EN

Stack Overflow用户

发布于 2014-02-26 02:49:41

解决方案:使用reloadSlider

代码语言:javascript
复制
   slider = $('.bxslider').bxSlider();
   slider.reloadSlider();
票数 5
EN

Stack Overflow用户

发布于 2012-03-17 06:36:49

正如该网站所说:为了使用公共函数,您需要将slideshowContainer附加到变量。由于reloadShow()destroyShow()是公共函数,因此这是唯一可行的方法。对我来说效果很好。我只是简单地放了一个

代码语言:javascript
复制
var $theslideshow = [functionThatCallsYourSlideshow] 

在我的函数之前调用,之后调用$theslideshow.destroyShow();

希望这能有所帮助

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/5845180

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档