Freecode
>  Home   HTML   CSS   JavaScript   PHP   Perl   Photoshop   TCP/IP 

ทำป้ายหัวข้อสวยๆแบบที่ 2

          สคริปต์นี้จะวาดหัวข้อให้ท่านอย่างสวยงาม ต่างกับแบบที่ 1 ตรงที่จะใส่คำอธิบายลงไปได้ด้วย ไม่ง้อภาพให้เปลืองแบนวิธ

:: How to Build ::
  1. ฟังก์ชั่นนี้เป็นตัวสังเคราะห์โค้ด HTML ให้เอาไปใส่ในส่วน <HEAD> มันจะเอาอินพุตมาตัดเป็นส่วนๆ แล้วแสดงออกมาด้วยการสังเคราะห์โค้ด HTML ตามที่มีการจัดรูปแบบไว้ <script language="JavaScript"> function header_2(H_string,comment) { document.write('<table bgcolor=#FF9933 width=100%>'); document.write('<tr><td class=header1>&nbsp;'); document.write(H_string.charAt(0)); document.write('&nbsp;</td><td width=100%>'); document.write('<table border=0 cellpadding=0 '); document.write('cellspacing=0 width=100%>'); document.write('<tr><td class=header2>&nbsp;'); for (var wch=1;wch<H_string.length;wch++) { document.write(H_string.charAt(wch)+'&nbsp;'); } document.write('</td><td align=right class=header3>'); document.write('<font color=#FF9933><b>::</b></font>'); document.write('&nbsp;'+comment+'&nbsp;'); document.write('<font color=#FF9933><b>::</b></font>&nbsp;'); document.write('</td></tr></table></td></tr></table>'); } </script>
  2. ส่วนโค้ดนี้เป็น Style Sheet ที่ใช้ร่วมกันกับ Script ตัวนี้ ให้เอาไปใส่ในส่วน <HEAD> เช่นกัน <style type="text/css"> .header1 { font-family: MS Sans Serif; font-size: 14x; font-weight: bold; text-decoration: none; color: #000000; background-color:#FFCC00; } .header2 { font-family: MS Sans Serif; font-size: 14x; font-weight: bold; text-decoration: none; color: #FFCC00; background-color:#000000; } .header3 { font-family: MS Sans Serif; font-size: 14x; font-weight: normal; text-decoration: none; color: #FFFFFF; background-color:#000000; } </style>
  3. เวลาจะเขียนหัวข้อตรงไหน ให้เรียกใช้ตามตัวอย่างข้างล่าง <script language="javascript"> header_2('FREE JAVASCRIPT', 'ฟรี จาวาสคริปต์พร้อมอธิบายเพื่อให้ท่านเอาไปพัฒนาต่อได้'); </script>

Back to top





© copyright 2001 Sorrawut Korsuwansiri