Easyslider 1.7帮助 - 在页面加载时显示所有内容 [英] Easyslider 1.7 help - all content displaying on page load
问题描述
在我的页面上使用jQuery实现Easy Slider 1.7时,我发现当页面首次加载时, ul
滑块中的两个图像都会显示,然后加载滑块正确,只显示第一张幻灯片。
In implementing Easy Slider 1.7 with jQuery on a page of mine, I find that when the page first loads, both images in the ul
slider display and then the slider loads properly and only the first slide is displayed.
纠正此问题的最佳方法是在脚本加载之前不显示滑块 div
正常吗?我正在使用此代码运行它:
What is the best way to correct this so that the slider div
doesn't display until the script has loaded properly? I'm using this code to run it:
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
pause: 10000
});
});
推荐答案
你可以通过CSS隐藏内容,像这样:
You can just hide the content via CSS, like this:
#slider { display: none; }
然后在页面加载时显示:
Then show it on page load as well:
$(document).ready(function(){
$("#slider").show().easySlider({ auto: true, continuous: true, pause: 10000 });
});
为了安全起见我为非JS用户添加一个块到页面,可能是一个如果你有很多这样的样式表,否则只是一个样式标记:
To be safe I'd add a block to the page for non-JS users, could be a style sheet inside if you have a lot of these, otherwise just a style tag:
<noscript><style type="text/css">#slider { display: block; }</style></noscript>
这篇关于Easyslider 1.7帮助 - 在页面加载时显示所有内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!