• 欢迎访问往前方博客,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入往前方 QQ群
  • 百度口碑求点赞啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊http://koubei.baidu.com/s/www.wangqianfang.com
  • 新版往前方影院 原藏藏影院重新开启http://movie.wangqianfang.com/欢迎围观
  • 分享IT江湖那些趣事,那些牛人传说,那些稀奇古怪的网站,那些爱不释手的应用软件!如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏往前方吧
  • 往前方的推荐:每日更新.帮助广大网友各位小伙伴买到更有性价比商品往前方力荐!http://mai.ziyuandi.cn 戳这里跟着资源帝挖白菜,从此快递收不停!

WordPress好玩的JS代码-网站左下角会动的蒲公英

WordPress 往前方 191次浏览 已收录 0个评论 扫描二维码

WordPress好玩的JS代码-网站左下角会动的蒲公英

WordPress好玩的JS代码-网站左下角会动的蒲公英

以下为全部代码:

<div class="dandelion">
<span class="smalldan"></span>
<span class="bigdan"></span>
</div>
<style type="text/css">
@media screen and (max-width:600px){
.dandelion{display: none !important;}
}
.dandelion .smalldan {
width: 36px;
height: 60px;
left: 88px;
background-position: 0 -90px;
border: 0px solid red;
}
.dandelion span {
-webkit-animation: ball-x 3s linear 2s infinite;
-moz-animation: ball-x 3s linear 2s infinite;
animation: ball-x 3s linear 2s infinite;
-webkit-transform-origin: bottom center;
-moz-transform-origin: bottom center;
transform-origin: bottom center;
}
.dandelion span {
display: block;
position: fixed;
z-index:9999999999;
bottom: 0px;
background-image: url(http://www.12580sky.com/content/uploadfile/201610/45da1476877560.png);
background-repeat: no-repeat;
_background: none;
}
.dandelion .bigdan {
width: 64px;
height: 115px;
left: 41px;
background-position: -86px -36px;
border: 0px solid red;
}
@keyframes ball-x {
0% { transform:rotate(0deg);}
25% { transform:rotate(5deg); }
50% { transform:rotate(0deg);}
75% { transform:rotate(-5deg);}
100% { transform:rotate(0deg);}
}
@-webkit-keyframes ball-x {
0% { -webkit-transform:rotate(0deg);}
25% { -webkit-transform:rotate(5deg); }
50% { -webkit-transform:rotate(0deg);}
75% { -webkit-transform:rotate(-5deg);}
100% { -webkit-transform:rotate(0deg);}
}
@-moz-keyframes ball-x {
0% { -moz-transform:rotate(0deg);}
25% { -moz-transform:rotate(5deg); }
50% { -moz-transform:rotate(0deg);}
75% { -moz-transform:rotate(-5deg);}
100% { -moz-transform:rotate(0deg);}
}
</style>


往前方 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明WordPress好玩的JS代码-网站左下角会动的蒲公英
喜欢 (1)
[fmfbth@qq.com]
分享 (0)
往前方
关于作者:
专注网络资源,分享最具价值内容!热爱互联网,痴迷于和计算机网络有关的一切事物。
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址