0

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

这是在 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)
        });
    }); 
4

1 回答 1

0

不得不移动这个:

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

在滑块 div 之外。那个标记搞砸了箭头功能。

于 2011-01-25T19:24:45.980 回答