0

我很难理解是什么导致我的 jQuery 脚本在第一次加载时正确加载（单击导航链接），但是在浏览器中点击“刷新”时失败。

这是一个简单的脚本，可以循环浏览一系列图像，全尺寸并在流畅的布局中居中。加载后，脚本应为图像设置适当的左边距，使其在屏幕上居中。当您单击导航中的链接时，它似乎可以工作。当我刷新页面时，脚本失败，并为图像提供了应有的左边缘两倍，将照片偏移到屏幕的一侧。

幻灯片可以在这里看到。您应该能够通过刷新页面来复制错误，然后点击导航中的蓝色“tiburon 住宅”链接。（截图：http: //imgur.com/a/z2hki）

http://dev.christinerode.com/garyhutton/tiburon.html

我尝试更改脚本和 CSS 包含的顺序以及函数，但我没有运气。为什么这只会在某些刷新时发生？

使用 jquery.cycle 插件，但找不到任何其他情况。javascript 中发生了什么来触发相同代码的不同显示？

4

1 回答 1

0

几个建议：

将所有脚本放在</body>标签之前。这样，您可以确保在测量 DOM 元素大小之前加载文档：

  <script> // jquery // </script>
  <script> // cycle.plugin </script>
  <script> // your jQ functions // </script>

</body>

您可以添加一个if语句来检查您的幻灯片是否为动画以防止在画廊动画时点击：

$("#slide_prev").click(function(){
   if( !($('.slideshow img').is(':animated') ) ){
      $('.slideshow').cycle("previous");
   }
});
$("#slide_next").click(function(){
   if( !($('.slideshow img').is(':animated') ) ){
      $('.slideshow').cycle("next");
   }
});

这将阻止我对您的问题的评论中的问题。

如果您仍然有错误（我不建议但您可以尝试的是）：

$(window).load(function(){
    // your functions
});
于 2012-05-13T22:58:01.793 回答