Xin chào, hôm nay mình sẽ chia sẻ cho các bạn giao diện tạo sóng nhạc dành cho blogspot, giao diện này đã được leech từ HTML5 về và tùy biến, cập nhật một số tính năng cần thiết. 
| Mã nguồn: | Blogspot |
|---|---|
| Tác giả: | Võ Hữu Nhân |
| Phiên bản: | Miễn phí |
<style>
.bsw_post-info3{z-index:99;display:inline-block}
.bsw_post-info3 .comment_info{
height: 38px;
width: 38px;
line-height: 38px;
padding: 0;
margin:0 3px;
float: left;
text-align: center;
border-radius: 50%;
font-weight: 400;
color: #666!important;
transition: .345s;
font-size: 18px!important;
cursor:pointer
}
.bsw_post-info3 .comment_info:hover,.bsw_post-info3 .comment_info:focus{background:#ededed}
.bsw_arrow-alert{position:absolute;background:#ddd;padding:10px 15px;margin:5px 0 0 20px;font-weight:500;color:#555;font-size:15px;border-radius:4px;opacity:0;visibility:hidden;transition:.3s;bottom:-36px;width:fit-content;margin-left:-50px}
.bsw_arrow-alert:before{;content:'';position:absolute;top:-12px;left:30px;width:0;height:0;border-right:17px solid transparent;border-bottom:20px solid #ddd;border-top:0 solid transparent;border-left:0 solid transparent;transform:rotate(-10deg)}
.bsw_post-info3:hover .bsw_arrow-alert{opacity:1;visibility:visible}
#bsw_post-info3{
position: fixed;
top: 2%;
z-index: 99;
left: 50%;
padding: 8px 10px 5px;
text-align: center;
background: #fff;
box-shadow: 0 0 80px rgba(0,0,0,.2);
transform: translate(-50%,0);
border-radius: 12px;
}
</style>
<div id='bsw_post-info3'>
<div class='bsw_post-info3'><a class='comment_info hastip0_bacsiwindows' href='/'><i class='fa fa-home'/></a><span class='bsw_arrow-alert'>Trở về trang chủ</span></div>
<div class='bsw_post-info3'>
<a class='comment_info hastip0_bacsiwindows' href='//facebook.com/share?url=data:post.url' onclick='window.open(this.href, "_blank", "height=430,width=640"); return false;'><i class='fa fa-facebook'/></a><span class='bsw_arrow-alert'>Chia sẻ lên Facebook</span></div>
<div class='bsw_post-info3'><a class='comment_info hastip0_bacsiwindows' href='#comment-form'><i class='fa fa-comments-o'/></a><span class='bsw_arrow-alert'>Tổng số bình luận: <!--Can't find substitution for tag [post.numComments]--></span></div>
<div class='bsw_post-info3'><a class='comment_info' href='//plus.google.com/share?url=https://chanhducblogger.blogspot.com/2018/03/cach-tao-form-contact-tuyet-ep-cho.html' onclick='window.open(this.href, "_blank", "height=430,width=640"); return false;' target='_blank'><i class='fa fa-google-plus'/></a><span class='bsw_arrow-alert'>Chia sẻ lên Google</span></div>
<div class='bsw_post-info3'><a class='comment_info' onclick='CopyLink()'><i class='fa fa-unlink'/></a><span class='bsw_arrow-alert'>Sao chép địa chỉ liên kết</span></div>
<div class='bsw_post-info3'><a class='comment_info' href='http://chanhducblogger.blogspot.com/p/lien-he-voi-nguyen-chanh-uc.html' target='_blank'><i class='fa fa-envelope-o'/></a><span class='bsw_arrow-alert'>Liên hệ / Báo lỗi / Góp ý</span></div>
<div class='bsw_post-info3'><a class='comment_info hastip0_bacsiwindows' href='javascript:;' id='back-to-top'><i class='fa fa-angle-double-up'/></a><span class='bsw_arrow-alert'>Trở về đầu trang</span></div>
<div class='bsw_post-info3'><a class='comment_info' id='hidden_post-info'><i class='fa fa-remove'/></a><span class='bsw_arrow-alert'>Đóng Menu</span></div>
</div>
<script>
$(document).ready(function(){
$("#hidden_post-info").click(function(){
$("#bsw_post-info3").hide();
});
}); $('#back-to-top').click(function () {
$('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
</script>
© Copyright Test template tin tức | Design By Free Blogger Templates.