本站的导航条二级菜单展开缓冲效果就是使用插件easing实现的,类似弹簧的缓冲效果...
在实际应用中偶尔会使用到这个插件以实现缓冲效果,现在这里记录下插件easing的用法。此插件依赖jquery库,自身是一个js插件文件,引用代码如下:
最常使用的插件属性为easeOutBounce,调用方法:
easing:"easeOutBounce"
完整可运行的代码如下:
缓冲效果插件easing用法*{margin:0;padding:0;}
body{padding:50px;}
.clickBox{width:200px;height:45px;margin:0 auto; text-align:center;padding:10px;}
.demo{width:200px; height:200px; border:1px red solid;margin:0 auto;}
.demo p{width:200px; height:200px; background:#0f0; display:block;overflow:hidden; text-align:center;}
$(function(){
$(".demo p").css({
//width:0,
height:0
})
$("a").hover(function(){
$(".demo >p").animate({
//width:200,
height:200
},{duration:1000,easing:"easeOutBounce"})</
本文链接:https://my.lmcjl.com/post/12614.html
展开阅读全文
4 评论