Question

我正在使用jQuery GalleryView插件。我在一个页面上使用该插件并将其包含在div中，并使用相应的代码将div的id发送到外部GalleryView .js文件。

我也使用jQuery来隐藏文档准备好的div，因此用户可以切换可见性，但由于某些原因当div被隐藏时，图库无法正确加载。我相信这可能是因为代码中的脚本没有被调用，因为它处于隐藏状态。

我希望我已经清楚地解释了这一点。有没有人有任何想法？

可以找到插件主页here或者我相信jQuery页面更新，但没有详细记录。

Answer 1

最有可能的是，画廊有计算宽度/高度的问题，因为元素是隐藏的。

你应该在图库初始化之后隐藏元素，或者通过CSS（最初）将其移出屏幕，一旦图库初始化，隐藏它并将其恢复到原位......

<强> 更新
（在评论和检查插件源代码之后）

问题绝对是您在文档就绪事件中隐藏包含div。真正的问题是插件在window load而不是dom ready执行其代码，这意味着在图像加载后...

如果在执行之前隐藏它，则插件fails可以正确识别图像的某些属性，如宽度/高度等。

如果画廊占据的空间是相同的，无论它是隐藏还是显示，那么我建议不要隐藏容器，而是设置visibility:hidden。这不会像display:none那样扭曲图像的属性（它是.hide()使用的）

所以

$(document).ready(){
  // hide container
  $('#container').css('visibility','hidden');
  // plugin init call here
  $('#id').galleryView({...});
}

如果你需要画廊消失并在隐藏时释放它的空间，那么你需要在插件完成初始化后调用隐藏..

$(document).ready(){
  // plugin init call here 
  $('#id').galleryView({...});
}

$(window).load(){
  // your code to hide the container of the gallery
  // we use timeout to give some time for the gallery code to execute first..
  setTimeout(function(){ $('#containerid').hide(); }, 100 );
}

Answer 2

http://docs.jquery.com/Plugins/livequery

由于在页面加载时隐藏了父div，JavaScript未被执行？

3 个答案: