Online reservation system for Joomla and Drupal
1

Widget nhạc ẩn hiện khi Click chuột

Filled under : NEW , THỦ THUẬT





Ưu điểm thủ thuật này là khi bạn ẩn trình nghe nhạc vẫn tiếp tục chạy nếu bạn không ấn tạm dừng. Có thể áp dụng với cả nhạc hình và nhạc không hình.


1. Đầu tiên bạn hãy vào tài khoản blogger
2. Vào Thiết kế chọn 
Phần tử trang - Thêm tiện ích - HTML/Javarscrip và dán code bên dưới vào:



<style type="text/css">
#gb{
position:fixed;
bottom:5px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:74px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyuTlCn59AR3Ey5b8p6fFOiVyhmUE4fHjxL1VCC6KXY9Lkm3ifRrTljoRa1hat3R4sVX4_2BPP_1nTlqy2OPSMc4xcAu5XAiziurdK4WZkhmvxEKnpvX9OuUlQUOSdWrBlf6Zgc3m3RnHy/s1600/widget-choi-nhac-an-hien-namkna-ngoctra.gif') no-repeat;
}
.gbcontent{
float:left;
background:none;
padding:3px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 75-w) : moveGB(71-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()">
</div>
<div class="gbcontent">
<iframe allowfullscreen="" frameborder="0" height="320" src="http://www.youtube.com/embed/WS8OMAmmuSY" width="520"></iframe></div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (75-gb.offsetWidth).toString() + "px";
</script>

Trong đó: Mùa đỏ: là mã nhúng của đoạn nhạc
Màu xanh: là ảnh hiện thị khi bạn Click vào. Các bạn cso thể dùng Photoshop để tự thiết kế cho mình các ảnh đẹp nha. Nếu bạn nào chưa cài photoshop có thể thiết kế Online TẠI ĐÂY
Chúc thành công!

Bookmark and Share

Tác Giả Admin

Tags: NEW , THỦ THUẬT

1 nhận xét

  1. Nặc danh lúc 05:55 12 tháng 3, 2012

    Thanhs nhe! minh lam duoc roi.

Leave a reply

  • Hỗ trợ kỹ thuật

      HỖ TRỢ TRỰC TUYẾN

      Yahoo! Messenger

      Mr Thanh Phương


      Yahoo! Messenger

      Mr Anh Tu


  • Bài Mới

  • Bình Luận

Người theo dõi