常用CSS3
.trans-3{-webkit-transition: all 0.35s linear; -moz-transition: all 0.35s linear; -ms-transition: all 0.35s linear; -o-transition: all 0.35s linear; transition: all 0.35s linear;}
.trans-8{-webkit-transition: all 0.8s; -moz-transition: all 0.8s; -ms-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s;}
.trans-12{-webkit-transition: all 1.2s; -moz-transition: all 1.2s; -ms-transition: all 1.2s; -o-transition: all 1.2s; transition: all 1.2s;}
.scale-0x{-webkit-transform: scale(0.75); -moz-transform: scale(0.75); -ms-transform: scale(0.75); -o-transform: scale(0.75); transform: scale(0.75);}
.scale-1x{-webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05);}
.radius-5{-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.radius-15{-webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
.radius-half{-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}
.shadow{-webkit-box-shadow: 7px 7px 7px #dad6d6; -moz-box-shadow: 7px 7px 7px #dad6d6; box-shadow: 7px 7px 7px #dad6d6;}
.shadow-all{-webkit-box-shadow: 0 15px 15px #f2f2f2; -moz-box-shadow: 0 15px 15px #f2f2f2; box-shadow: 0 15px 15px #f2f2f2;}
$(function(){
$(".imgbox").hover(function(){
$(this).find("img").eq(0).addClass("scale-1x")
},function(){
$(this).find("img").eq(0).removeClass("scale-1x")
})
//产品列表
$(".product ul li").hover(function(){
$(this).stop().animate({top: "-10px"},100)
$(this).addClass("shadow")
},function(){
$(this).stop().animate({top: "0px"},100)
$(this).removeClass("shadow")
})
})
最后更新于 2018-04-27 10:54:38 并被添加「」标签,已有 743 位童鞋阅读过。
本站使用「署名 4.0 国际」创作共享协议,可自由转载、引用,但需署名作者且注明文章出处
此处评论已关闭