Safari中jQuery事件链的问题

我正在使用jQuery，jflickrfeed和jQuery.Masonry构建一个简单的photolog - 但我在Safari中正确地获取事件链时遇到了一些麻烦。Safari中jQuery事件链的问题

下面是一些示例代码：

$(document).ready(function() { 
    $('#container').jflickrfeed({ 
     limit: 20, 
     qstrings: { 
      id: '[email protected]' 
     }, 
     itemTemplate: '<div class="box"><img src="{{image_m}}" /><h3>{{title}}</h3>{{description}}</div>' 
    }, function(data) { 
     console.log("1st"); 
    }); 
}); 

$(window).load(function() { 
    console.log("2nd"); 
    $('#container').masonry({ 
     singleMode: true 
    }); 
});

所以，jflickrfeed拉从我的Flickr的饲料中的照片，把它封装在模板代码，并追加其在#container内，并重复，直到达到限制。所有照片插入后，砌体踢入并安排divs。

在Chrome和Firefox中运行良好，但在Safari中无法运行 - 在所有照片完成加载之前，.load事件触发，从而破坏了布局。

我已更新示例以更好地展示我的意思。在Chrome/Firefox中，控制台输出为“1st，2nd”，而在Safari中则为“2nd，1st”

任何提示？

来源

2010-12-08 jonnablaze

通过添加计数器解决它自己：

var counter = 0; 

$(document).ready(function() { 
    $('#container').jflickrfeed({ 
     limit: 20, 
     qstrings: { 
      id: '[email protected]' 
     }, 
     itemTemplate: '<div class="box"><img src="{{image_m}}" /><h3>{{title}}</h3>{{description}}</div>', 
     itemCallback: function() { 
      counter++; 
     } 
    }); 
}); 

$(window).load(function() { 
    var i = setInterval(function() { 
     if (counter = 20) { 
      $('#container').masonry({ 
       singleMode: true 
      }); 
      clearInterval(i); 
     } 
    }, 20); 
});

丑陋，但它的工作原理..

来源

2010-12-10 11:45:11 jonnablaze

我不知道这将是多么有用，或者如果将有所作为。但是，如果问题是#container在$(window).load火灾时不可用，您可以尝试设置一个定时器来重复检查它是否存在，以及何时检测到，设置石工，然后杀死定时器：

$(window).load(function() { 
    var i = setInterval(function() { 
     if($("#container").length) { 
      $('#container').masonry({ 
       singleMode: true 
      }); 
      clearInterval(i); 
     }}, 
    20); 
});

来源

2010-12-08 11:40:49 karim79

是什么，首先你的代码发布？它的工作方式像魔术，但由于某种原因，这不.. – jonnablaze 2010-12-08 17:43:58

@jonnablaze - 是的。现在我很困惑：| – karim79 2010-12-08 19:19:31

您可以将加载回调作为第二个参数传递给“jflickrfeed”调用，这将确保仅当来自Flickr的图像加载后才会调用“masonry”。

这里是一个可能的示例：

$('#container').jflickrfeed({ 
    limit: 20, 
    qstrings: { 
     id: '[email protected]' 
    }, 
    itemTemplate: '<div class="box"><img src="{{image_m}}" /><h3>{{title}}</h3>{{description}}</div>' 
}, 
function() { 
    $('#container').masonry({ 
     singleMode: true 
    }); 
});

希望它能帮助。

来源

2010-12-08 11:41:24 Arnab

Safari中jQuery事件链的问题

回答

相关问题