Lải nhải
Trước mình có sử dụng để đếm ngược trên trang chủ của Sonako, giờ cài cho tất cả các trang, ai thích thì có thể dùng. Tốt nhất là nên để ở đầu trang của bạn để thông báo về một sự kiện nào đó sắp diễn ra :v
Cách dùng
Các bạn gõ Code như sau
<div class="countdown" data-date="năm-tháng-ngày giờ:phút:giây"></div>
Ví dụ:
<div class="countdown" data-date="2112-12-25 00:00:00"></div>
Sẽ ra là
Với định dạng thời gian là: năm-tháng-ngày giờ:phút:giây
Hoặc các bạn cũng có thể tạo 1 cái đồng hồ đếm ngược với số giây định trước
<div class="countdown" data-timer="số giây muốn đếm ngược"></div>
Ví dụ <div class="countdown" data-timer="100"></div>
Sẽ ra là:
Mặc định thì đồng hồ này sẽ choán toàn bộ khung trang.
Để có thể điều chỉnh độ cao hay rộng hay vị trí trái phải của khung đồng hồ đếm ngược thì các bạn có thể thêm như sau:
Ví dụ:
<div class="countdown" data-date="2020-1-1 00:00:00" style="width: 500px; height: 200px; padding: 0px; box-sizing: border-box; background-color: #E0E8EF; float: left"></div>
Sẽ ra là:
Ngoài ra thì các bạn cũng có thể chèn nhiều đồng hồ khác nhau vào trong cùng 1 trang
Update: 27/7/2016
Có thể tạo đồng hồ tự động reset lại sau khi kết thúc 1 quãng thời gian.
Các bạn gõ theo cú pháp sau
<div class="countdown reset" data-timer="số giây muốn đếm ngược"></div>
Ví dụ <div class="countdown reset" data-timer="20"></div>
Sẽ ra là: