我正在制作一个网站,其中所有内部链接使当前页面淡出并且新页面淡入.这对我来说非常有用.问题是我正在尝试将它与伟大的砌体插件结合起来.在第一个页面加载砌体确实有效,但我似乎无法弄清楚如何通过ajax重新激活新加载的内容上的砌体.我应该补充一下,当前砌体中的所有项目都会被删除,然后被新的替换.
砌体代码是这样的:
$container = $('#container');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '.item',
transitionDuration: 0
});
});
Run Code Online (Sandbox Code Playgroud)
而ajax加载代码是这样的:
var newHash = "",
$mainContent = $("#ajaxcontainer"),
$ajaxSpinner = $("#loader"),
$el;
$('.internal').each(function() {
$(this).attr("href", "#" + this.pathname);
});
$(document).on('click', '.internal', function() {
window.location.hash = $(this).attr("href");
});
$(window).bind('hashchange', function(){
newHash = window.location.hash.substring(1);
if (newHash) {
$mainContent.fadeOut(500, function() {
$ajaxSpinner.fadeIn();
$mainContent.load(newHash + " #container", function() {
$ajaxSpinner.fadeOut( function() {
$mainContent.fadeIn(1000);
});
$('.internal').each(function() {
$(this).attr("href", "#" + this.pathname);
});
});
});
};
});
$(window).trigger('hashchange');
Run Code Online (Sandbox Code Playgroud)
有没有人有任何关于如何实现这一目标的意见?非常感谢你.