首先非常感谢网友雨的无私分享,此Jquery特效是一款现在互联网上非常流行的一种布局结构,结合了瀑布流布局,最近很多网友问到这种特效,网站上暂时还没有网友们分享过,今天网友雨按照Facebook网站Timeline时间轴的制作教程终于把一个完整的demo制作出来与大家分享。
主要实现代码如下:
$(function(){
// masonry plugin call
$('#container').masonry({itemSelector : '.item'});
//injecting arrow points
function Arrow_Points(){
var s = $("#container").find(".item");
$.each(s,function(i,obj){
var posLeft = $(obj).css("left");
if(posLeft == "0px"){
html = "<span class='rightCorner'></span>";
$(obj).prepend(html);
} else {
html = "<span class='leftCorner'></span>";
$(obj).prepend(html);
}
});
}
Arrow_Points();
});
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
Timeline 时间轴 Facebook 瀑布流 网友雨 Jquery.masonry