.share_layer_shade { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(https://www.mebo.com/Public/share/images/hei.png) repeat; z-index: 99; } .share_layer_box { display: none; width: 300px; padding: 20px; background: #fff; position: fixed; top: 30%; left: 0; right: 0; z-index: 999; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin: -30% auto 0; } .share_layer_box h3 { display: block; width: 100%; height: 30px; line-height: 30px; padding: 0 0 10px 0; margin: 0; border-bottom: 1px solid #cccccc; } .share_layer_box h3 .text { float: left; font-size: 16px; font-family: 'Microsoft JhengHei', 'Microsoft YaHei', Arial, sans-serif; font-weight: 600; color: #62d397; text-indent: 0.5em; display: block; } .share_layer_box h3 .close { display: block; width: 30px; height: 30px; background: url(https://www.mebo.com/Public/share/images/close.png) 0 0 no-repeat; float: right; cursor: pointer; } .share_layer_box h3 .close:hover { background-position: 0 -31px; } .share_layer_box .layer_content { display: block; width: 100%; height: 100%; margin-top: 10px; margin-bottom: 10px; padding: 0; position: relative; } /*Share*/ #Share { text-align: justify; } #Share ul { margin: 0; padding: 0; list-style-type: none; } #Share ul li { float: left; display: block; width: 45px; height: 50px; margin-left: 5px; margin-right: 5px; cursor: pointer; position: relative; } #Share ul li a { display: block; width: 28px; height: 28px; margin-left: 11px; margin-top: 12px; } #Share ul li span { display: block; width: 40px; height: 10px; background: url(https://www.mebo.com/Public/share/images/share_shade.png) 0 0 no-repeat; position: absolute; left: 5px; bottom: 0; opacity: 1; } #Share ul li a.share-qq { background: url(https://www.mebo.com/Public/share/images/share-qzone.png) no-repeat left top; background-size: 100% 100%; } ul li a.share-qq { background: url(https://www.mebo.com/Public/share/images/share-qzone.png) no-repeat left top; background-size: 100% 100%; } #Share ul li a.share-xl-weiBo { background: url(https://www.mebo.com/Public/share/images/share-weBo.jpg) no-repeat left top; background-size: 100% 100%; } ul li a.share-xl-weiBo { background: url(https://www.mebo.com/Public/share/images/share-weBo.jpg) no-repeat left top; background-size: 100% 100%; } #Share ul li a.share-people { background: url(https://www.mebo.com/Public/share/images/share-more-people.jpg) no-repeat left top; background-size: 100% 100%; } ul li a.share-people { background: url(https://www.mebo.com/Public/share/images/share-more-people.jpg) no-repeat left top; background-size: 100% 100%; } #Share ul li a.share-tx-weiBo { background: url(https://www.mebo.com/Public/share/images/share-qWeBo.jpg) no-repeat left top; background-size: 100% 100%; } ul li a.share-tx-weiBo { background: url(https://www.mebo.com/Public/share/images/share-qWeBo.jpg) no-repeat left top; background-size: 100% 100%; } #Share ul li a.share-tx-weChat{ background: url(https://www.mebo.com/Public/share/images/share-wechat.jpg) no-repeat left top; background-size: 100% 100%; } ul li a.share-tx-weChat{ background: url(https://www.mebo.com/Public/share/images/share-wechat.jpg) no-repeat left top; background-size: 100% 100%; } /* 微信分享弹层样式 */ .towdimcodelayer { position: absolute; left: -55px; top: 40px; z-index: 10000; margin-top: 0; opacity: 0; filter: alpha(opacity=0); } .js-transition { transition: margin-top .15s ease, opacity .12s linear; -webkit-transition: margin-top .15s ease, opacity .12s linear; -moz-transition: margin-top .18s ease, opacity .15s linear; -ms-transition: margin-top .15s ease, opacity .12s linear; -o-transition: margin-top .15s ease, opacity .12s linear; } .towdimcodelayer .arrow { position: absolute; width: 0; height: 0; border-width: 8px; border-style: solid; _display: none; } .towdimcodelayer .js-arrow-up { left: 72px; top: -15px; border-color: transparent transparent #62d397 transparent; } .towdimcodelayer .js-arrow-down { left: 72px; bottom: -15px; border-color: transparent transparent #62d397 transparent; } .towdimcodelayer .layerbd { width: 100px; height: 150px; padding: 30px 30px 0 30px; background: #62d397; box-shadow: 0 1px 3px #000; -webkit-box-shadow: 0 1px 3px #000; -moz-box-shadow: 0 1px 3px #000; -o-box-shadow: 0 1px 3px #000; } .towdimcodelayer .codebg { width: 75px; height: 75px; padding: 13px 12px 12px 13px; background: #fff; } .towdimcodelayer .codebg img { width: 75px; height: 75px; } .towdimcodelayer .codettl { height: 22px; line-height: 22px; margin-top: 5px; color: #191919; font-size: 12px; } .js-show-up { margin-top: 15px; opacity: 1; filter: alpha(opacity=100); } .js-show-down { margin-top: -15px; opacity: 1; filter: alpha(opacity=100); }