Hello xin chào các bạn cũng đã lâu lắm rồi mình mới ra một thủ thuật hay cho những ai đang làm Blogspot.Hôm nay mình sẽ hướng dẫn các bạn các thêm nhạc nền vào Blog đơn giản,đẹp,dễ làm nhất nhá :D



Bước 1 : Các bạn vào Chủ Đề < Chỉnh Sửa HTML

Bước 2 : Dán code bên dưới này vào trước thẻ đóng <body>


<style>
.music-box{position:fixed;width:300px;height:60px;z-index:120;bottom:10px;left:30px}
@media (max-width: 991px) {
.music-box{width:250px;height:120px;left:auto;left:30px}
}
.music-box .music-holder{width:100%;height:100%;border:2px solid #eee;position:absolute;left:0;top:-30px;visibility:hidden;opacity:0;-webkit-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out}
.music-box .music-holder iframe{width:100%;height:100%}
.music-box button{background:rgba(0,0,0,0.1);width:40px;height:40px;line-height:37px;font-size:18px;font-size:1rem;color:#5e9a8e;border:1px solid #e6e6e6;outline:0;padding:0;margin:0;position:absolute;left:0;bottom:0;-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;-ms-border-radius:50%;border-radius:50%}
@media (max-width: 991px) {
.music-box button{left:auto;left:0}
}
.music-box .toggle-music-box{top:-50px;visibility:visible;opacity:1}
</style>
<div class="music-box">
<button class="music-box-toggle-btn">
<a title="Play music"><i class="fa fa-music"></i></a>
</button>
<div class="music-holder">
<iframe src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/444209886&amp;auto_play=true&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>
</div>
</div> 
<script type="text/javascript">
//<![CDATA[
if($(".music-box").length) {var musicBtn = $(".music-box-toggle-btn"),musicBox = $(".music-holder");musicBtn.on("click", function() {musicBox.toggleClass("toggle-music-box");return false;})}
//]]>
</script>
Bước 3 : Lưu lại và tận hưởng thành quả !
Chúc các bạn thành công ^^

Nguồn : Codedayroi.net


- - 15 bình luận
CHUYÊN MỤC
- Đối với tôi mọi thứ mình biết chưa nên tự cho mình là giỏi,hãy nên học hỏi nhiều hơn để thành công...
- Mọi chi tiết xin liên hệ:
Email: Naruto95qt@gmail.com
Zalo Me: Zalo.com/01625271155

BÌNH LUẬN (15)

Một số lưu ý khi bình luận

Vui lòng xem Hướng Dẩn Sử dụng trước khi bình luận

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời

Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước (xem nội quy)