在我的标题中,我加载脚本(我将这些脚本保存在我的服务器上,原始链接只是为了您的参考):
<script src="http://jscrollpane.kelvinluck.com/script/jquery.mousewheel.js"></script>
<script src="http://jscrollpane.kelvinluck.com/script/mwheelIntent.js"></script>
<script src="http://jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js">
然后在页脚我执行了一些代码:
$(document).ready(function() {
$(function(){
$('.scroll-pane').load().jScrollPane();
});
numOfPics = $('#gallery-wraper img').size();
widthOfAll = 0;
$('#gallery-wraper img').each(function() {
imgWidth = $(this).width() + 20;
widthOfAll += imgWidth;
}); // end of each
$("#gallery-container").load().css("width",widthOfAll);
galleryPosition = $(window).height() / 2 - 250;
$("#gallery").css("margin-top", galleryPosition);
});// end of document.ready()
我希望它能够水平显示我的图片,并将其放置在jScrollPane中(http://jscrollpane.kelvinluck.com/),但是只有在刷新页面后(甚至在Chrome中刷新几次)才会水平显示我的图片。看起来它试图在页面内容生成之前(这是一个WordPress主题)或在滚动库加载之前执行我的代码。我的逻辑有什么问题?我正在使用document.ready(),为什么会出现这种情况?
$(window).load
对你的网站不起作用吗?这是一个很好的链接,说明何时使用load
或ready
。http://web.enavu.com/daily-tip/daily-tip-difference-between-document-ready-and-window-load-in-jquery/ - acedocument.ready()
更改为window.load()
,而我的代码保持不变。 - smogg