Question

我有jquery分页代码工作。我希望一次添加淡入淡出两个项目。

<ul class="paging">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
    <li>7</li>
    <li>8</li>
    <li>9</li>
    <li>10</li>
</ul>

这是我的演示。

http://jsfiddle.net/squidraj/6KRez/2/

请建议。

Answer 1

您需要将.fadeIn()和.fadeOut()应用于<ul class="paging">而不是<li>。这是因为如果你执行$('li').fadeIn()，jQuery会依次将淡入动画应用于每个元素。如果您要$('ul').fadeIn()，那么jQuery会将淡入动画应用于整个<ul>，包括<li>元素，在您的情况下，只有2个是一次展示。所以....

而不仅仅是：

// show/hide the appropriate regions 
selector.children().hide();
selector.children(".simplePagerPage" + options.currentPage).show();

你需要这样做：

$('ul.paging').fadeOut(400, function() {
     // finished fading out animation
     //hide and show relevant links
     selector.children().hide();
     selector.find(".simplePagerPage" + clickedLink).show();
}).fadeIn();

请参阅小提琴：http://jsfiddle.net/amyamy86/gpmSP/

淡入淡出，每次淡出2个项目

1 个答案: