素材网 素材网

CSS3网页右侧悬浮固定二维码扫描与在线客服等功能代码

下载资源()次

阅读次数()次

发布时间:2015-08-10

CSS3网页右侧悬浮固定二维码扫描与在线客服等功能代码
分享到:

用法简介:

来源:xw素材网

CSS3网页右侧悬浮固定二维码扫描与在线客服等功能代码。
文件引用:

.toolbar-item,.toolbar-layer{background:url(../images/toolbar.png) no-repeat;}
.toolbar{position:fixed;right:0px;bottom:50px;}/*假设网页宽度为1200px,导航条在右侧悬浮*/
.toolbar-item{display:block;width:52px;height:52px;margin-top:1px;position:relative;-moz-transition:background-position 1s;-ms-transition:background-position 1s;-o-moz-transition:background-position 1s;-webkit-moz-transition:background-position 1s;transition:background-position 1s;}
.toolbar-item:hover .toolbar-layer{opacity:1;filter:alpha(opacity=100);transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}
.toolbar-item-weixin{background-position:0 -798px;}
.toolbar-item-weixin:hover{background-position:0 -860px;}
.toolbar-item-weixin .toolbar-layer{height:212px;background-position:0 0;}
.toolbar-item-feedback{background-position:0 -426px;}
.toolbar-item-feedback:hover{background-position:0 -488px;}
.toolbar-item-app{background-position:0 -550px;}
.toolbar-item-app:hover{background-position:0 -612px;}
.toolbar-item-app .toolbar-layer{height:194px;background-position:0 -222px;}
.toolbar-item-top{background-position:0 -674px;}
.toolbar-item-top:hover{background-position:0 -736px;}
.toolbar-layer{position:absolute;right:46px;bottom:-10px;width:172px;opacity:0;filter:alpha(opacity=0);
transform-origin: 95% 95%;-moz-transform-origin: 95% 95%;-ms-transform-origin: 95% 95%;-o-transform-origin: 95% 95%;-webkit-transform-origin: 95% 95%;transform:scale(0.01);
-moz-transform:scale(0.01);-ms-transform:scale(0.01);-o-transform:scale(0.01);-webkit-transform:scale(0.01);transition:all 1s;-moz-transition:all 1s;-ms-transition:all 1s;-o-transition:all 1s;-webkit-transition:all 1s;}


   

相关标签:

网友评论:

评论

发表 剩余字数:20

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

@ 2013 xwcms.net . All Rights Reserved. xw素材网 | 备案号:晋ICP备13005902号 联系管理员
×

邮箱订阅

什么是邮箱订阅?

邮箱订阅是xw素材网为jquery爱好者与web程序员提供一项以邮箱的方式发送最新jquery资源与素材资源的模式,用户只需在左侧填写正确的邮箱用户名与邮箱地址我们将每天推荐最新优质资源到用户邮箱。当然每份邮箱都会有一个取消订阅按钮,当用户点击取消按钮时我们将会停止对用户发送邮箱资源推送。再次感谢大家对xw素材网的支持与关注。