วันนี้เพิ่มหัวข้อใน Blog สักหนึ่งหัวข้อครับ เอาไว้รวบรวมความรู้เรื่อง Css หรือ cascading style sheetsที่นำเอามาใช้ในการตกแต่งหน้าเวบเพจกัน รับรองว่าสามารถนำไปใช้ได้จริงไม่ยุ่งยากมากครับ วันนี้มาประเดิมด้วยการทำBlinkหรือตัวหนังสือกระพริบกันครับ อาจจะไม่ค่อยเกี่ยวกับcss มากนะแต่ก็สามารถนำมาใช้ตกแต่งเพิ่มลูกเล่นในหน้าเวบได้อย่างดีทีเดียว
ความจริงแล้วในhtml tagมี<blink></blink>ใช้ครับแต่สามารถรันได้บนBrowserที่เป็น Netscape Browserหรือ FireFox Browser แต่ไม่สามารถใช้ได้บน Browser ที่เป็น Internet Explorer เพราะฉะนั้นเราต้องนำเอาความสามารถของ javascript มาช่วยครับ
มาดูตัวอย่าง Blink บน Netscape Browserหรือ FireFox Browser กันครับ
<blink>Text Blink Netscape Browseror FireFox Browser </blink>
ส่วนใน IE ก็เพิ่ม code javascript ด้านล่างลงไปในส่วนของ code html
<script type="text/javascript">
window.onload=function(){
setInterval('blinkIt()',500)
}
function blinkIt() {
if (!document.all) return;
else {
for(i=0;i<document.all.tags('blink').length;i++){
s=document.all.tags('blink')[i];
s.style.visibility=(s.style.visibility=='visible')?'hidden':'visible';
}
}
}
</script>
ลองเรียกใช้ดูกันครับ
<blink><font color="green">Blink On Internet Explorer</font></blink>
ผลจากการรันบน Brower InterNet Explorer
Blink On Internet Explorer
ยังมีวิธีหนึ่งครับที่สามารถนำไปใช้บน Netscape Browserหรือ FireFox Browser
คือการกำหนด Css
<style>
.blk {text-decoration: blink; text-align: center}
</style>
เรียกใช้
<span class="blk" >Css Blink for FireFox,Netscape browser Not IE </span>
ลองไปเล่นกันดูนะครับ ถ้าถามว่าอันไหนรันได้ทุก Browser แน่นอนครับก็ต้องเป็นการเอา javascript เข้ามาช่วยใน IE ครับเพราะสามารถนำไปใช้ใน FireFox หรือ Netscape browser ได้ด้วย