Question

我有启用wordpress的网站，我想创建一个精选块。这个特色区块的特色文章将陆续褪色。我通过使用jQuery的fadeIn和fadeOut API来实现它，但是实现存在问题。

这是我的代码 -

var count=0;
var sticky_count=<?php echo count($sticky);?>;

jQuery(document).ready(featured_block);

function featured_block() {   
    jQuery(".featured" + count % sticky_count).delay(5000).fadeOut(callback);
}

function callback() {
    count++;
    jQuery(".featured" + count % sticky_count).fadeIn().delay(5000);
    jQuery(".featured" + count % sticky_count).fadeOut(callback);
}

fadeIn - fadeOut效果正常工作，直到用户导航到页面底部。当用户位于页面底部时，整个页面会在淡入淡出切换时向上滚动。

您可以在http://www.ronakg.com

看到这一点

请告知我如何避免页面滚动。

编辑：以下是HTML代码的外观 -

<div class="featured0">
    ...
</div>

<div class="featured1" style="display:none">
    ...
</div>

...

Answer 1

尝试使用CSS提供淡入和淡出静态height:属性的块的包含元素。

用另一个div包裹<div id="featured">块。

<div id="rotator" style="height: 340px;">
    <div id="featured">
     ...
    </div>
</div>

Answer 2

如果你使用<a>和href等于＆＃34;＃＆＃34;，只需输入false;在你应该解决问题的feature_block函数的最后。

jQuery fadeIn fadeOut使页面滚动

2 个答案: