Home » Thủ thuật blog
Đếm ngược sự kiện với jQuery

Ở thủ thuật này ta có thể tùy chỉnh được kiểu chữ hiển thị. Khác với 1 số tiện ích đếm ngược khác.
Hình minh họa kết quả :

- Như đã nói ở trên, các bạn có thể tùy chỉnh kiểu chữ, kích thước, màu sắc hiển thị theo ý mình, chỉnh cần cần chỉnh sửa code CSS trong các class tương ứng (xem hình minh họa ở trên sẽ rõ)
☼ Các bước thực hiện:
1. Vào bố cục
2. vào chỉnh sửa code HTML
3. Chèn đoạn code bên dưới vào trước thẻ đóng </head>
<style style="text/css">
.count_down{
padding: 3px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:24px;
font-weight:bold;
color:#f00;
}
.count_down sup{
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#555;
font-weight:normal;
}
</style>
<script type="text/javascript" src="http://data.fandung.com/blog/demo/countdown-jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://data.fandung.com/blog/demo/countdown-jquery/countdown.js"></script>
4. Save template
5. Tạo 1 widget HTML/Javascript rồi dán đoạn code bên dưới vào:
<div id="count_down_container"></div>
<script type="text/javascript">
var currentyear=new Date().getFullYear()
var target_date=new cdtime("count_down_container", "December 31, "+currentyear+" 0:0:00")
target_date.displaycountdown("days", displayCountDown)
</script>
- Chú ý đoạn code màu đỏ, đây chính là mốc thời gian để đếm ngược. và các tháng trong năm phải viết bằng tiếng anh đúng chính tả.
Power by Dynamic
Chúc các bạn thành công.

- Plugin LightBox cho blogspot (Phần 1)
- Tiện ích Recent posts khá ấn tượng với jQuery
- [ Yêu cầu ] Tạo menu giống trang phununet.com
- [ Yêu cầu ] : Trình diẽn bài viết dạng Slide với jQuery (cập nhật)
- Tiện ích "Recent posts" với hiệu ứng trượt từ jQuery
- Tiện ích Recent posts tích hợp hiệu ứng từ jQuery
- Hiệu ứng show ảnh từ jQuery
- Tiện ích "Bài viết mới nhất - có ảnh thumbnail" kết hợp với hiệu ứng slide từ jQuery
- Tạo thanh TabNews cho Header khá ấn tượng với jQuery
- Tab Menu cực cool cho blog với jQuery
- Tạo thanh menu ngang với hiệu ứng từ jQuery
- Tạo nút lên đầu trang với hiệu ứng từ jQuery
Comments[ 0 ]
Đăng nhận xét