แสดงข้อความวิ่งที่ Status Bar จัดทำโดย : เว็บไทยดีดี พิมพ์
 แสดงข้อความวิ่งที่ 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/

คุณอาจสนใจ
การทำ Bar Slider คล้ายกับการปรับ Volume ใน winamp
Charoen (47,862 - 28 ม.ค. 51)
ประเภทของข้อมูลและตัวดำเนินการในภาษา c
Mr.POP (54,841 - 26 พ.ย. 50)
การใส่ Comment ใน HTML
สายลม (80,115 - 04 มิ.ย. 49)
Crop Tool (C)
Mr.GuruZ (64,016 - 22 ก.ย. 50)
สร้าง Play list Windows Media Player แบบเร่งด่วน
เว็บไทยดีดี (17,453 - 01 มี.ค. 51)
หน้าต่างเชื่อมต่อเน็ตโผล่ขึ้นมาเองแก้ไงนะ XP
เว็บไทยดีดี (15,242 - 26 ม.ค. 51)
สร้าง Background ท้องฟ้าอย่างง่ายๆ ด้วย DreamScape
เว็บไทยดีดี (25,398 - 02 เม.ย. 51)
การใช้งานคำสั่ง switch
Mr.GuruZ (27,749 - 03 มิ.ย. 49)