Question

我正在使用jQuery anythingSlider来旋转内容。我在滑块下面有一个小标签，用户可以点击它来切换整个滑块的显示。我在包装整个滑块的div上使用jQuery animate（）函数。当我这样做时，它会禁用anythingSlider箭头，这是我的问题。当我从div包装器中删除animate函数时，anythingSlider箭头再次起作用。我有一种感觉，将anythingSlider放在一个应用了jQuery动画功能的div中。谁能证实这一点？如果是这样，我可以用另一种方式切换anythingSlider的显示？

这里是jsFiddle，你可以看到我的箭头不能正常工作的问题：http://jsfiddle.net/brianmcculloh/H2hPQ/3/

HTML：

<div id="slider-wrapper">             
<div id="slider">        
        <div class="wrapper"> 
            <ul>
                <li> content... </li>
                <li> content... </li>
                <li> content... </li>
                <li> content... </li>
                <li> content... </li>
                <li> content... </li>
            </ul>
        </div>
<div class="bottom">&nbsp;</div>
</div></div>



<div id="slider-tab"> <!-- the tab that toggles the slider panel --> 
    <div onclick="showslider()" id="slider-button"> 
        <a title="Toggle this panel">toggle</a> 
</div></div>

使用Javascript：

function showslider() {
        $('#slider-wrapper').animate({
             opacity: 'toggle',
             height: 'toggle',               
            }, 300, 'linear' );
    }

 $(document).ready(function() { 

        function formatText(index, panel) {
          return index + "";
        }

        //SLIDER
        $('#slider').anythingSlider({
            easing: "easeInOutExpo",        // Anything other than "linear" or "swing" requires the easing plugin
            autoPlay: true,  // This turns off the entire FUNCTIONALY, not just if it starts running or not.
            delay: 3000,  // How long between slide transitions in AutoPlay mode
            startStopped: false,            // If autoPlay is on, this can force it to start stopped
            animationTime: 600,             // How long the slide transition takes
            hashTags: false,                 // Should links change the hashtag in the URL?
            buildNavigation: false,          // If true, builds and list of anchor links to link to each slide
            pauseOnHover: true,             // If true, and autoPlay is enabled, the show will pause on hover
            startText: "Go",             // Start text
            stopText: "Stop",               // Stop text
            navigationFormatter: formatText       // Details at the top of the file on this use (advanced use)
        });
    });

Answer 1

不得不动摇这个：

<div class="bottom">&nbsp;</div>

滑块div之外。该标记搞砸了箭头功能。

在包含anythingSlider（）的面板上使用jQuery animate（）时出现问题

1 个答案: