|
แสดงข้อความวิ่งที่ Status Bar
บทความนี้ผมจะมาแนะนำการ Java Script ที่ทำให้ Status Bar มีข้อความวิ่งครับคิดว่าหลายๆ คนคงอยากรู้ว่าทำกันอย่างไร ไม่ยากครับ มาลองดูกันเลยนะครับ
ขั้นตอนการทำ
1. สร้างไฟล์ demo.html เพื่อใช้ในการทดสอบ Script นะครับ แล้ว copy code ด้านล่างนี้ เอาไว้ที่ tag <head> นะครับ
<script language="JavaScript" type="text/javascript">
<!-- Beginning of JavaScript Code--------->
function scroll_status (seed)
{
var msg = "พิมพ์ข้อความที่ต้องการให้แสดงที่นี่ครับ";
var out = " ";
var c = 1;
if (150 < seed) {
seed--;
var cmd="scroll_status(" + seed + ")";
timerTwo = window.setTimeout(cmd, 100);
}
else if (seed <= 150 && 0 < seed) {
for (c=0 ; c < seed ; c++) {
out+=" ";
}
out+=msg;
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 0) {
if (-seed < msg.length) {
out+=msg.substring(-seed,msg.length);
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("scroll_status(150)",100);
}
}
}
// -- End of JavaScript code -------------- -->
</SCRIPT>
หลังจาก copy code มาวางไว้ที่ tag <head> แล้วนะครับ จะต้องเหมือนกับ code ด้านล่างนะครับ
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!-- Beginning of JavaScript Code--------->
function scroll_status (seed)
{
var msg = "^_^ ข้อความที่ต้องการให้แสดงที่นี่ครับ ขอให้สนุกกับการทำนะครับ^_^"; //ส่วนนี้จะเป็นข้อความที่คุณจะต้องให้แสดงผลที่ Status Bar นะครับ
var out = " ";
var c = 1;
if (150 < seed) {
seed--;
var cmd="scroll_status(" + seed + ")";
timerTwo = window.setTimeout(cmd, 100);
}
else if (seed <= 150 && 0 < seed) {
for (c=0 ; c < seed ; c++) {
out+=" ";
}
out+=msg;
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 0) {
if (-seed < msg.length) {
out+=msg.substring(-seed,msg.length);
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("scroll_status(150)",100);
}
}
}
// -- End of JavaScript code -------------- -->
</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HV menu</title>
</head>
<body>
</body>
</html>
2. แล้ว Copy code นี้เอาไปไว้ใน tag <body> นะครับ
onLoad="timerONE=window.setTimeout('scroll_status(100)',50);"
หลังจาก copy code มาวางไว้ใน tag <body> แล้วนะครับ จะต้องเหมือนกับ code ด้านล่างนะครับ
<body onLoad="timerONE=window.setTimeout('scroll_status(100)',50);">
3. นี้ครับตัวอย่างที่สมบูรณ์ครับ
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!-- Beginning of JavaScript Code--------->
function scroll_status (seed)
{
var msg = "^_^ ข้อความที่ต้องการให้แสดงที่นี่ครับ ขอให้สนุกกับการทำนะครับ^_^";
var out = " ";
var c = 1;
if (150 < seed) {
seed--;
var cmd="scroll_status(" + seed + ")";
timerTwo = window.setTimeout(cmd, 100);
}
else if (seed <= 150 && 0 < seed) {
for (c=0 ; c < seed ; c++) {
out+=" ";
}
out+=msg;
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 0) {
if (-seed < msg.length) {
out+=msg.substring(-seed,msg.length);
seed--;
var cmd="scroll_status(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("scroll_status(150)",100);
}
}
}
// -- End of JavaScript code -------------- -->
</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>HV menu</title>
</head>
<body onLoad="timerONE=window.setTimeout('scroll_status(100)',50);">
</body>
</html>
 คลิกดูตัวอย่าง
ข้อมูลจาก : http://www.codetukyang.com/java/
|
แสดงข้อความวิ่งที่ Status Bar
จัดทำโดย : เว็บไทยดีดี 
