jQuery多代码显示/隐藏闪烁
jQuery多代码显示/隐藏闪烁
提问于 2016-01-15 19:25:20
我有三个代码，我正在使用jQuery循环。它运行良好，但问题是，我留下的是一个轻微的闪烁时，滴答被切换。有谁知道这里会有什么问题吗？这是我错过的非常简单的东西吗？
Fiddle: https://jsfiddle.net/3yhaynpz/7/
jQuery
$('document').ready(function(){
var tick1 = $(".tick1");
var tick2 = $(".tick2");
var tick3 = $(".tick3");
tick2.hide();
tick3.hide();
cycle();
function cycle(){
if (tick1.css('display') !== 'none')
setTimeout(function() {
tick1.hide();
tick2.show();
cycle();
}, $('.tick1 ul li').length * 1000);
else if (tick2.css('display') !== 'none')
setTimeout(function() {
tick2.hide();
tick3.show();
cycle();
}, $('.tick2 ul li').length * 1000);
else if (tick3.css('display') !== 'none')
setTimeout(function() {
tick3.hide();
tick1.show();
cycle();
}, $('.tick3 ul li').length * 1000);
}
});回答 2
Stack Overflow用户
回答已采纳
发布于 2016-01-15 20:00:34
问题是，您使用的脚本是在元素动画时在元素上设置38px的高度，然后是动画之前的20px高度。在这样做的时候，你看到的闪烁正在发生。
最简单的解决方案是在min-height元素上指定一个38px的.tickerwrap。
.tickerwrap {
position: relative;
min-height: 38px;
overflow: hidden;
/* ... */
}Stack Overflow用户
发布于 2016-01-15 19:29:18
不要使用display: none;，而是使用CSS属性visibility: hidden;。这样，空间将永远被无形的元素所占据。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34818341
复制相关文章
相似问题
腾讯云开发者
