Question

如果您转到http://sandkasse.shoporama.dk/，您会在页面顶部看到一个bxslide。至少，你会在不使用chrome的情况下（特别是在safari，IE或firefox中似乎没有出现这个问题）。

我遇到的问题是，从chrome加载页面时，bxslider中使用的图像不会加载。提神通常可以解决问题。我得到的只是用于切换幻灯片的两个按钮，但是当点击它们时没有任何反应。

我没有收到任何错误消息。

我假设问题是当$（＆＃39; .bxslider＆＃39;）时图像还没有完成加载.bxSlider（）;在$（document）.ready（function（）{}）中调用。但是，对此有什么好处？如果我将bxslider调用移动到window.load，我会得到一个有点丑陋的结果，幻灯片中的所有图像都会显示，直到整个页面加载完毕，宽度和样式都不正确。我想我可以改变所有图像的可见性和样式，直到页面完成加载，但这看起来更像是一个黑客而不是一个解决方案？

使用某种imagesloaded事件而不是document.ready是一个明智的选择吗？无论如何都包括imagesloaded包。但是，我怀疑我会遇到所有图像显示的问题，直到最后一次加载？

相关的问题可能是，无论使用哪种浏览器，滑块总是在加载页面时跳到最后一张幻灯片。我已经修复了＃34;通过设置＆＃34; startSlide＆＃34;手动

我希望我的问题有道理。我知道这里有很多关于bxslider的问题，但我找不到任何解决这个问题的人，除了人和放弃＆＃34;当事物加载时，只是隐藏图像？

Answer 1

我可能已经提出了一个适当的非hacky解决方案：

在window.load调用中重新加载滑块。因此，我的bxslider调用已转换为：

var slider; // has to be defined beforehand so I can use it in window.load
$(document).ready(function(){
//initialize slider
slider = $('.bxslider').bxSlider({
 startSlide:0
});
};)

$(window).load(function() {
  slider.reloadSlider();

 });

bxslider不会等待chrome中的图像;跳到最后一张幻灯片

1 个答案: