我的 jquery masonry 设置在初始页面加载时工作得很奇怪。似乎将图像放置在第一行中,第二行的位置与第一行重叠,第三行的位置相同。页面加载后,您可以单击主页按钮或徽标并重新加载页面,它可以正常工作。
我在functions.php中有这段代码,用于将masonry和jquery脚本放入:
if (!is_admin()) {
wp_enqueue_script('jquery');
wp_register_script('jquery_min', get_template_directory_uri(). '/js/jquery.min.js', array('jquery'), '1.6.1' );
wp_enqueue_script('jquery_min');
wp_enqueue_script('jquery');
wp_register_script('jquery_masonry', get_template_directory_uri(). '/js/jquery.masonry.min.js', array('jquery'), '2.1.06' );
wp_enqueue_script('jquery_masonry');
}
该脚本位于 head.php 中:
<?php if (is_page(2)) { ?>
<script>
$(function(){
$('#content').masonry({
// options...
itemSelector : '.product',
columnWidth : 310,
isAnimated: true,
animationOptions: {
duration: 700,
easing: 'linear',
queue: false
}
});
});
</script>
<?php } ?>
这是一个链接site.
知道为什么在初始页面加载时会奇怪地加载吗?
我对编写任何脚本都很陌生,所以请友善。
我认为这是因为脚本是在内容(图像)完全加载之前运行的。因此出现定位误差。
尝试这个。
$(window).load(function()
{
$('#content').masonry({
itemSelector : '.product',
columnWidth : 310,
isAnimated: true,
animationOptions: {
duration: 700,
easing: 'linear',
queue: false
}
});
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)