我正在组合galleryView和fancybox插件来加载页面上的一些图片库。
一切都很好但我感觉我很幸运......
这是我在页面加载时所做的事情：
jQuery(document).ready(function(){
//Bind fancybox links with live
jQuery('a.fancybox').live('click', function(){
jQuery.fancybox(this,{
'easingIn' : 'swing',
'easingOut' : 'swing',
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 400,
'speedOut' : 200,
'overlayShow' : true,
'overlayOpacity' : 0.8
});
return false;
});
//Load Galleryview
jQuery('#current_gallery').galleryView({
panel_width: 520,
panel_height: 345,
frame_width: 100,
frame_height: 60,
transition_interval: 999999999,//To keep the images still
nav_theme: 'light',
pause_on_hover: true
});
});
jQuery(document).ready(function(){
//Wrap full size image in 'a' tags
jQuery('div.panel img').each(function(i){
//Get full size image url
var full_image_url = jQuery(this).attr('src');
jQuery(this).wrap('<a href=' + full_image_url + ' class="fancybox" />')
});
});
基本上我按顺序排队执行调用两个.ready（）函数。 Galleryview修改DOM，我的第二个.ready（）包装来自修改后的DOM的元素。它有效，但我是否遵循正确的方法？我称这个脚本使用Ajax加载其他画廊，再次没问题......
我应该使用这样的东西：
$(function () {
window.setTimeout(function () {
//Wrap full size image in 'a' tags
jQuery('div.panel img').each(function(i){
//Get full size image url
var full_image_url = jQuery(this).attr('src');
jQuery(this).wrap('<a href=' + full_image_url + ' class="fancybox" />')
})}, 0);
有什么建议吗？
谢谢。