Xem demo ở đây: http://fandung.110mb.com/JS-files/easy-scroller/index.html
Khi bạn rê chuột vào button Up thì nội dung bên trong sẽ trượt xuống, khi bạn rê vào button Down thì nội dung sẽ trượt lên, còn khi nhấn vào button Reset thì nội dung sẽ trở về vị trí ban đầu.
Bài viết này mình sẽ chỉ giới thiệu thủ thuật, còn việc áp dụng cho các widget thì các bạn có thể tự theo hướng dẫn của bài này mà thực hiện. Sau này rảnh mình sẽ áp dụng nó cho các widget và viết bài hướng dẫn sau.
☼ Bắt đầu thủ thuật:
1. Đăng nhập blog
2. Vào bố cục
3. Vào chỉnh sửa code HTML
4. Chèn đoạn code bên dưới vào trước thẻ đóng </head>
<script type="text/javascript" src="http://fandung.110mb.com/JS-files/easy-scroller/easyscroll.js"></script>
<script type="text/javascript">
var speed = 5;
var height = 250;
</script>
<style type="text/css">
#easyscroll{
background:#eee;
margin:1em 0;
/* add additional styling */
}
/* easyscroll navigation buttons */
#easyscrollnav, #easyscrollnav li{
height:28px;
line-height:28px;
margin:0;
padding:0;
}
#easyscrollnav{
margin:1em 0;
}
#easyscrollnav li{
list-style:none;
float:left;
background:#eee;
margin-right:10px;
padding:0 10px;
color:#333;
cursor:pointer;
}
#easyscrollnav li.over{
color:#999;
text-decoration:underline;
background:#ccc;
}
</style>
- Vài chú thích nhỏ :
+ var height = 250; : chiều cao của tab.
5. Và đây là code HTML của thủ thuật :
<div id="myContent">
{NỘI DUNG CỦA TAB}
</div>
Khi muốn áp dụng cho 1 widget hoặc 1 tiện ích nào, bạn chỉ cần thay đoạn code màu xanh thành nội dung của widget đó là xong. Nếu không thực hiện được, hoặc không biết cách thực hiện, có thể vào mục yêu cầu thủ thuật của blog mình để yêu cầu mình giúp, mình sẽ hướng dẫn cho các bạn.
Hạn chế của thủ thuật là chỉ chạy được 1 tab trên 1 trang mà thôi.
Chúc các bạn thành công.
Anh choáng trước cường độ làm việc của em đấy.
:D, bài này cũng ngắn thôi anh.
Đúng là có mấy bài em viết lâu thiệt, có nhưng bài em ngồi viết cả mấy h.
Ẹc đúng là choáng thật :|. Không biết FD có nghỉ được vào lúc nào ko nhỉ
Hiệu ứng này đã thật - Khi nào phải áp dụng cho mấy trang đọc Online :)
waw, cái này hay tuyệt, thk a
@Thành Công : có nghỉ chứ bạn, mới đi đá banh từ giấc 20h nè, về đến nhà gần 11h , mở blog lên thấy 1 nùi comment luôn :D.
Chắc hum nay là bữa nhiều comment nhất :)
ặc comment sai, phải nói là đi đá giấc 20h , về nhà giấc gần 23h :p
cộng đồng blog có người như Anh Dũng thật là tốt quá.hihi=))
Bữa nào em phải bóc tem của anh phát,bên anh Dũng toàn bị vietutd bóc tem hoài.hehe
Các bạn mở hàng liệu có đắt khách bằng mình không mà đòi tranh. :D
Ai thuê người mở hàng có duyên đê
thanks mọi người nhiều :D
HC có nhờ bác hướng dẫn cách chèn vào mấy cái tiện ích có sẵn của google mà lâu quá ko thấy bản viết lên :(
Ví dụ như widget Nhãn, Blogroll,danh sách những gì bạn thích.
sorry Hiệp Cò mình cũng đang tính post lên cho bạn nè. Chỉ là trang trí trung và tạo thanh trượt cho widget ngắn đi thôi phải ko bạn???
» Nội dung phải liên quan tới chủ đề bài viết.
» Có thể sử dụng thẻ trích dẫn [quote], cấu trúc thẻ như bên dưới :
[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]
» Có thể sử dụng các thẻ <b>,<i>,<a>.
BlOg FD chính thức đóng comment của khách ẩn danh.
BlOg FD.