Demo : http://game-vn.tk
Công dụng : Như tiêu đề
Cách làm :
1. Các bạn tải file .zip về giải nén ra và upload file sharing-sprite.png lên thư mục gốc của style bạn
2. Vào AdminCP > Styles > Appearance > Styles > Template > footer thêm đoạn code sau vào cuối :
Thay lại các đường dẫn mạng xã hội của bạnMã:<div id="social-sharing-box" class="like"> <a class="facebook" href="http://www.facebook.com/" rel="nofollow" target="_blank">Facebook</a> <a class="twitter" href="https://twitter.com/" rel="nofollow" target="_blank">Twitter</a> <a class="googleplus" href="https://plus.google.com/" rel="nofollow" target="_blank">Google plus</a> <a class="linkedin" href="http://www.linkedin.com/" rel="nofollow" target="_blank">Linkedin</a> </div>
3. Tiếp tục với template footer.css thêm đoạn code sau vào trên cùng :
Dòng @media all and (max-width:1245px){#social-sharing-box{display:none;} này các bạn có thể xóa đi nếu thích hoặc chỉnh cái max-width lạiMã:#social-sharing-box{position:fixed;right:20px;bottom:30px;overflow:hidden;}#social-sharing-box a{display:block;float:right;position:relative;text-decoration:none;text-indent:-9999em;padding:0;margin:0;background:url('@imagePath/xenforo/sharing-sprite.png') no-repeat -76px 0;width:81px;height:85px;vertical-align:top;z-index:110;}#social-sharing-box a.twitter,#social-sharing-box a.linkedin,#social-sharing-box a.googleplus{background-position:-38px -49px;transition:margin 300ms;-webkit-transition:margin 300ms;width:37px;height:36px;margin:43px -49px 0 4px;z-index:105;} #social-sharing-box a.googleplus{background-position:0 -49px;} #social-sharing-box a.linkedin{background-position:-38px -6px;margin-left:0;} #social-sharing-box:hover a.twitter,#social-sharing-box:hover a.linkedin,#social-sharing-box:hover a.googleplus{width:37px;margin:43px 0 0 4px;} @media all and (max-width:1245px){#social-sharing-box{display:none;}}
4.Done!
Thêm chú sóc chia sẻ mạng xã hội 2013-08-18
Thêm chú sóc chia sẻ mạng xã hội
comments powered by Disqus