使用appendBackTo时,尝试隐藏第一张幻灯片上的上一个箭头

时间:2013-09-17 22:56:34

标签: anythingslider

我实现隐藏第一张幻灯片上的上一个箭头,并使用以下方式隐藏最后一张幻灯片上的下一个箭头

infiniteSlides: false,
stopAtEnd: true,

但是当我使用时:

appendBackTo: $('#nav-slider'),
appendForwardTo: $('#nav-slider2'),

我想隐藏的箭头没有隐藏......

我错过了什么......?

以下整个代码:

<script>
    // DOM Ready
    $(function(){
        $('#slider')
            .anythingSlider({
                appendBackTo: $('#nav-slider  span:eq(0)'),
                appendForwardTo: $('#nav-slider  span:eq(1)'),
                forwardText: "dhdgd<img height='20' width='20' src='http://eofdreams.com/data_images/dreams/image/image-07.jpg'>",
                backText: "<img height='20' width='20' src='http://eofdreams.com/data_images/dreams/image/image-07.jpg'>dhdgd",
                resizeContents      : true,
                addWmodeToObject    : 'opaque',
                buildNavigation     : false,
                buildStartStop     : false,
                infiniteSlides: false,
                stopAtEnd: true
            })
            // Initialize video extension
            // see https://developers.google.com/youtube/player_parameters?hl=en#Parameters for a list of parameters
            .anythingSliderVideo({
                // video id prefix; suffix from $.fn.anythingSliderVideo.videoIndex
                videoId : 'asvideo',

            });
    });
</script>

非常感谢!

1 个答案:

答案 0 :(得分:0)

在这里找到解决方案2 how to disable anythingslider forward button onlast slide and back button on first page?

使用以下代码

    $('#slider').anythingSlider({
        onInitialized   : function(){
              // hide back arrow
              $('.arrow.back').hide();
        },
        onSlideComplete     : function(){
            if($('#slider .panel:not(.cloned)').first().hasClass('activePage')){
              // hide back arrow
              $('.arrow.back').hide();
            }
            else{
              $('.arrow.back').show();
            }

            if($('#slider .panel:not(.cloned)').last().hasClass('activePage')){
              // hide forward  arrow
              $('.arrow.forward').hide();
            }
            else{
              $('.arrow.forward').show();
            }
        }
    });