วันพุธที่ 30 มีนาคม พ.ศ. 2554

ตัวอย่างการทำ Preload ง่ายๆ ใน jQuery

 ในระหว่างการโหลดหน้าเว็บ จะเป็นการดีมากสำหรับผู้ใช้หากมีอะไรที่เคลื่อนไหวบ้าง เพื่อผู้ใช้จะได้สบายใจว่า web browser ยังทำงานอยู่ 
บทความนี้เราจะมาลองทำ preload กันด้วยการใช้ jquery เข้ามาช่วย โดยมีหลักการคือว่า ขณะที่ document ยังไม่พร้อมที่จะทำงาน เราจะให้ภาพ preload ทำงาน และเมื่อ document พร้อมที่จะทำงานแล้ว เราก็จะสังให้ภาพ preload หายไป



<script type="text/javascript" src="jquery.js">
<script>
$(document).ready(function(){
              $("#preloader").hide();
        });

         $("#preloader").hide();
      
</script>

<img src="preloader.gif" id="preloader" />

1 ความคิดเห็น: