Đồng hồ đếm ngược [Lưu Trữ] - HOA HỌC TRÒ (Matnauhoctro)

JavaScriptBank

14-10-2009, 11:32 PM

Đoạn mã này sẽ tạo một đồng hồ (http://www.javascriptbank.com/javascript/time/clock-time-date/) đếm ngược (http://www.javascriptbank.com/vi+title=đếm ngược) trên trang web (trong ví dụ là 10 phút), kh... chi tiết (http://www.javascriptbank.com/javascript-countdown-timer.html/vi//)

http://www.javascriptbank.com/javascript.images/time/countdown-timer.jpg (http://www.javascriptbank.com/javascript/time/counter/javascript-countdown-timer/preview/vi/)
Demo: Đồng hồ đếm ngược (http://www.javascriptbank.com/javascript-countdown-timer.html/vi/)
| Cách cài đặt[/SIZE]

Bước 1: Đặt mã CSS bên dưới vào phần HEAD
CSS

<style type="text/css">
#txt {
border:none;
font-family:verdana;
font-size:16pt;
font-weight:bold;
border-right-color:#FFFFFF
}

</style>


Bước 2: Đặt mã JavaScript bên dưới vào phần HEAD
JavaScript

<script language="javascript">
// Created by: Neill Broderick :: http://www.bespoke-software-solutions.co.uk/downloads/downjs.php

var mins
var secs;

function cd() {
mins = 1 * m("10"); // change minutes here
secs = 0 + s(":01"); // change seconds here (always add an additional second to your total)
redo();
}

function m(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(0, i));
}

function s(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(i + 1, obj.length));
}

function dis(mins,secs) {
var disp;
if(mins <= 9) {
disp = " 0";
} else {
disp = " ";
}
disp += mins + ":";
if(secs <= 9) {
disp += "0" + secs;
} else {
disp += secs;
}
return(disp);
}

function redo() {
secs--;
if(secs == -1) {
secs = 59;
mins--;
}
document.cd.disp.value = dis(mins,secs); // setup additional displays here.
if((mins == 0) && (secs == 0)) {
window.alert("Time is up. Press OK to continue."); // change timeout message as required
// window.location = "yourpage.htm" // redirects to specified page once timer ends and ok button is pressed
} else {
cd = setTimeout("redo()",1000);
}
}

function init() {
cd();
}
window.onload = init;
</script>


Bước 3: Copy mã HTML bên dưới và dán vào khu vực BODY trên trang web của bạn
HTML

<form name="cd">
<input id="txt" readonly="true" type="text" value="10:00" border="0" name="disp">
</form>


Các hiệu ứng tương tự
- Đồng hồ định dạng 12/24 giờ (http://www.javascriptbank.com/javascript-countdown-timer.html]JavaScript Countdown Timer

[SIZE="4)
- Tạo thời gian đếm ngược (http://www.javascriptbank.com/countdown-creator-script.html/vi/)
- Đồng hồ trong textbox (http://www.javascriptbank.com/simple-textbox-clock-script.html/vi/)
Bạn có thể xem thêm nhiều JavaScript khác về Thời gian (http://www.javascriptbank.com/javascript/time/vi/) và Bộ đếm (http://www.javascriptbank.com/javascript/time/counter/vi/)

Trình chơi nhạc giao diện iPod
(http://www.javascriptbank.com/ipod-player-using-flash.html/vi/) - JavaSript kiểm tra số điện thoại hợp lệ (http://www.javascriptbank.com/vi=kiểm tra điện thoại) -