实现跨浏览器CSS3 transitions效果的jQuery插件

tram.js是一款实现跨浏览器CSS3 transitions效果的jQuery插件。tram.js旨在提高CSS3
transition
的性能和灵活性,并通过jQuery来定义它们。tram.js提供强大的API来实现auto-stopping、sequencing和跨浏览器等功能。

当该jquery插件首次加载时,它将使用特性检测来判断浏览器是否支持CSS transitions。如果浏览器支持,Tram将管理样式并有浏览器来执行CSS3动画。如果浏览器不支持,Tram将使用自己的补间动画引擎为每一帧动画设置样式。

在线演示:http://www.htmleaf.com/Demo/201501311307.html

下载地址:http://www.htmleaf.com/jQuery/Layout-Interface/201501311306.html

时间: 2024-10-12 21:25:49

实现跨浏览器CSS3 transitions效果的jQuery插件的相关文章

跨浏览器实现placeholder效果的jQuery插件

曾经遇到这样一个问题,处理IE8密码框placeholder属性兼容性.几经周折,这个方案是可以解决问题的. 1.jsp页面引入js插件 <script type="text/javascript" src="<%=basePath%>/login.js" ></script> 2.页面初始化代码 <script type="text/javascript"> //input提示信息 效果插件 针对

跨浏览器的placeholder-jQuery版(jQuery插件EnPlaceholder)

案例:整搜索框,需要默认占位符为"请输入关键词",获取焦点时,占位符消失或不可用(不影响正常输入),丢失焦点后,若用户无内容输入,占位符继续出现,继续占位.这种代码我想前端们已经很容易就写出来了吧,现在HTML5原生就有这个"placeholder"属性,效果与上边案例描述的一样(各支持的浏览器内部表现可能不一致,但是作用是一致的),那么这一属性该怎么优雅降级到支持所有现代浏览器呢?答案还是脚本即JavaScript. 上述案例的一个图例:     下面我们就使用

javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)

类似于幻灯片的切换效果,有时需要在网页中完成一些图片的自动切换效果,比如广告,宣传,产品介绍之类的,那么单纯的切就没意思了,需要在切换的时候通过一些效果使得切换生动些. 比较常用之一的就是窗帘切换了. 先贴上完成的效果. 实现原理不复杂,在动的一条一条的称之为“窗帘条”或者是“strip”,每一个strip都是一个div,类似于雪碧图的方式将其背景图的位置设置为strip的可视位置,然后用jquery的animate让他们按照一定规律动起来就完成窗帘切换效果了. 为了使用方便,将这个功能作为jq

javascript设计模式实践之职责链--具有百叶窗切换图片效果的JQuery插件(三)

在上一篇<javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)>里,通过采用模板方法模式完成了切换效果对象的构建编写. 接下来就是完成各效果对象的调用和联动. 切换要求:当前图片显示指定时间后执行切换效果并切换下一张图片,最后一个切换后从头开始. 按照要求一个效果对象完成后要执行下一个,最后一个完成后要从头开始, 看上去就是一个带状态通知的环形列表,类似于这样的特征,可以采用职责链模式来构建. 职责链就是由不同的功能处理构成的链表,每一个功能处理作为一个

IE下支持文本框和密码框placeholder效果的JQuery插件

基于jQuery实现的,主要用于IE下实现placeholder效果,可同时支持文本和密码输入框.placeholder是HTML5新增的一个属性,当input设置了该属性后,该值的内容将作为灰色提示显示在文本框中,当文本框获得焦点时,提示文字消失. 实现代码如下: (function($) {  /**   * 没有开花的树   * 2012/11/28 15:12   */ var placeholderfriend = {    focus: function(s) {      s =

Html5添加三联切换仿3D效果旋转木马jQuery插件教程

一.使用方法 <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/gallery.js"></script> 二.Html结构 <div id="wrapper"> <div id=&quo

jQuery高性能跨浏览器全屏幻灯片特效插件

Nex是一款效果炫酷的.高性能的跨浏览器全屏幻灯片特效jQuery插件.该幻灯片插件允许你嵌入图片.视频,甚至是谷歌地图.该幻灯片提供了7组共34种不同的效果,可以使你适用于任何场景下使用. 它的特点有: 幻灯片外观可以自定义 优化速度 支持移动触摸设备 支持键盘导航 支持选择各种Pattern 对SEO优化十分友好 10种类型效果:Fade, Slide [left,right,top,bottom], Zoom, Skew, Rotate, Random, None 5种颜色主题:ameth

25个可遇不可求的jQuery插件

摘要:随着jQuery插件在网站建设过程中的使用率不断的增加,所以有必要跟进时代步伐开发出一些新的插件/代码片段,以此来巩固并提高前端用户体验,将用户体验提升到一个新的高度. 随着jQuery插件在网站建设过程中的使用率不断的增加,所以有必要跟进时代步伐开发出一些新的插件/代码片段,以此来巩固并提高前端用户体验,将用户体验提升到一个新的高度. 接下来所推荐的这些插件中有滑块.地图.图片旋转块等等,可以说是最好的.完全免费的jQuery插件. 1. Flat jQuery Price Slider

jQuery一步一步实现跨浏览器的可编辑表格,支持IE、Firefox、Safari、

脚 本 之 家 www.jb51.net 脚本云 专题 素材下载 电子书 软件下载 源码下载 服务器常用软件 a5交易 首页 网页制作 脚本专栏 脚本下载 网络编程 数据库 CMS教程 电子书籍 平面设计 媒体动画 操作系统 网站运营 网络安全 YUI.Ext相关 prototype jquery dojo json lib_js js面向对象 extjs Mootools Seajs 其它 特色栏目: vbscript 正则表达式 javascript 批处理 服务器软件 素材下载 低价出售流