注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

千年绿叶

黑夜给了我黑色的眼睛,我却用它来寻找光明......

 
 
 

日志

 
 

jQuery插件Flip  

2013-12-31 16:11:12|  分类: JQuery |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

lip 是一个基于 jQuery 的插件,它模仿流行的卡片翻转的效果,可以轻易的让元素在左右上下四个方向翻转。先看看效果吧,查看 Demo

Flip 同时基于 jQuery UI ,所以,要使用 Flip 需要引入 jQuery 和 jQuery UI 。

Flip 使用很简单,只需让元素调用 flip 方法就可以了。

$('.flipbox').flip({})

不过,仅仅只是单纯的调用 flip 方法的话,很多属性是默认的,也许不一定符合你的要求,你可以根据自己的要求、喜好添加相应的属性,Flip 提供的全部属性有:

content
定义翻转后元素的新内容,可以是:文本 、 HTML 或 jQuery 对象
direction
定义元素翻转的方向,可选:tb/bt/lr/rl ,默认为 tb
color
定义元素翻转后的背景颜色,默认是 #999999 (从 Firebug 查看得知)
speed
定义翻转的速度,默认为 500 毫秒
onBefore
定义元素翻转之前的回调函数
onAnimation
定义元素翻转到一半时的回调函数
onEnd
定义元素翻转之后的回调函数

好了,到这里已经介绍完毕,具体应用大家可以根据自己的喜好或发挥想象,这里我做了一个简单的类似幻灯片的翻页效果,查看 Demo

如果你想了解关于 Flip 的原文介绍或最新动态,你可以前往该插件的官方地址:http://lab.smashup.it/flip/

  评论这张
 
阅读(116)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018