Timeline时间轴Jquery特效是一款现在互联网上非常流行的一种布局结构,结合了瀑布流布局,最近很多网友问到这种特效,网站上有网友们分享过一款,功能虽然实现,但样式不太好看,今天就把它整理出来分享给大家,网友们好好利用哦。。。。

时间轴特效:​http://www.huiyi8.com/shijianzhou/​
页面使用代码如下:

<script type="text/javascript">
$(document).ready(function() {
/*时间轴*/
$('#Container').masonry({itemSelector : '.item'});
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();
});
</script>

Jquery实现超酷的时间轴特效的更多相关文章

  1. 超炫的时间轴jquery插件Timeline Portfolio

    Timeline Portfolio是一款按时间顺序专业显示事件的jquery时间轴插件,可以根据时间的先后嵌入各种媒体包括微博,视频和地图等.这个展现的模式非常适合设计师的作品集和个人简历的展示.T ...

  2. 基于jQuery发展历程时间轴特效代码

    分享一款基于jQuery发展历程时间轴特效代码,带左右箭头,数字时间轴选项卡切换特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="time ...

  3. 发展简史jQuery时间轴特效

    发展简史jQuery时间轴特效.这是一款鼠标滚动到一定的高度动画显示企业发展时间轴特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class="wr ...

  4. 一款基于jQuery的超酷动画幻灯片

    今天给大家带来一款仿步步高vivo手机网站的一款首页焦点幻灯展示特效,带有超酷炫的动画特效,动态效果丝毫不逊色于flash动画,具有很强的视觉冲击力,推荐下载学习! 提示:兼容360.FireFox. ...

  5. jQuery鼠标滑过横向时间轴效果

    jQuery鼠标滑过横向时间轴效果---效果图: jQuery鼠标滑过横向时间轴效果---全部代码: <!DOCTYPE html> <html> <head> & ...

  6. 炫酷CSS3垂直时间轴特效

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. [JQuery代码]超酷鼠标滑过背景高亮效果

    1.效果及功能说明 鼠标滑过悬停特效,div css制作产品列表图片布局通过鼠标滑过产品图片背景高亮闪烁显示,产品标题滑动显示或隐藏 2.实现原理 首先定义好一个重复实现效果的方法,然后定义光带出现速 ...

  8. Android 超仿Path时间轴和扇形菜单的效果

    网上看到的  ,仅此记录一下,用到的时候便于查找 效果如下: 源码下载地址 :  http://download.csdn.net/detail/abc13939746593/7251933

  9. 超酷的JavaScript叙事性时间轴(Timeline)类库

    在线演示 Timeline 是我见过的最酷的展示事件随时间发展的javascript实现.你可以基于时间使用讲故事的方式来创建时间轴特效,整个时间轴以幻灯的方式来展示,你可以穿插图片,视频或者是网站, ...

随机推荐

  1. 查看cup是32位还是64位

    1#echo  $HOSTTYPE 2#uname -a 3#getconf LONG_BIT

  2. 【Mac系统 + Python + Django】之搭建第一个【Django Demo(一)】

    我编写的此系列学习资料是通过虫师的python接口自动化出的书学习而来的,在此说明一下,想学习更多的自动化的同学可以找虫师的博客园,非广告,因为我python+selenium自动化也是跟虫师学的,学 ...

  3. 【JMeter4.0学习(九)】之定时器

    目录: 固定定时器 高斯随机定时器 附 一.固定定时器 1.添加线程组 2.添加固定定时器 3.添加HTTP请求 4.添加结果树以及运行  二.高斯随机定时器 1.添加线程组 2.添加高斯随机定时器 ...

  4. IOS发送带附件的邮件

    本文转载至  http://blog.csdn.net/zltianhen/article/details/7693810 1.加入邮箱的框架 #import <MessageUI/MFMail ...

  5. douban_转自熊博网——牛逼顿

    转自熊博网——牛逼顿 来自: 天云之叶(大道易得,小术难求) 2010-04-21 18:32:27 牛逼顿 作者:singularitys 3月28号是牛顿的忌日,但是知道的人很少,我们毕竟更关心沈 ...

  6. 九度OJ 1186:打印日期 (日期计算)

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:6366 解决:2214 题目描述: 给出年分m和一年中的第n天,算出第n天是几月几号. 输入: 输入包括两个整数y(1<=y<= ...

  7. [JavaScript]WebBrowser控件下IE版本的检测

    转载请注明原文地址:https://www.cnblogs.com/litou/p/10772272.htm 在客户端检查用户使用的浏览器类型和版本,都是根据navigator.userAgent属性 ...

  8. Visual studio 创建文件时自动添加备注

    Visual studio 创建文件时自动添加备注 描述 要求每回添加一个类,普通类或单元测试类文件头自动添加备注, 比如:Copyright, FileName, Author and so on. ...

  9. python+NLTK 自然语言学习处理五:词典资源

    前面介绍了很多NLTK中携带的词典资源,这些词典资源对于我们处理文本是有大的作用的,比如实现这样一个功能,寻找由egivronl几个字母组成的单词.且组成的单词每个字母的次数不得超过egivronl中 ...

  10. 聊聊数据库~5.SQL运维上篇

    1.6.SQL运维篇 运维这块逆天只能说够用,并不能说擅长,所以这篇就当抛砖之用,欢迎补充和纠错 PS:再说明下CentOS优化策略这部分的内容来源:首先这块逆天不是很擅长,所以主要是参考网上的DBA ...