setTimeout, show and hide using jQuery -


i have large want display onload , have timeout display smaller image. onmouseover, using jquery slide in large image , on mouse slide out large image , slide in smaller image. here code have mouseover, mouseout function. need start large 1 displayed 5 seconds , slide smaller one.:

<script type="text/javascript">        $(document).ready(function () {         $(".expanded").show();         $(".collapsed").hide();           $(".collapsed").mouseover(function () {             $(".collapsed").slideup(500);             $(this).next(".expanded").slidetoggle(500);         });          $(".expanded").mouseleave(function () {             $(".expanded").slideup(500);             $(".collapsed").slidedown(500);               });       }); </script> 

i create global variable "readyforhovering" set false until timeout expires such as:

var readyforhovering = false;    $(document).ready(function () {  settimeout(function() {   //code hide large image , show smaller image goes here    //now enable hovering...   readyforhovering = true; }, 5000);          $(".expanded").show();         $(".collapsed").hide();         //toggle componenet class msg_body         $(".collapsed").mouseover(function () {             if (readyforhovering) {                $(".collapsed").slideup(500);                $(this).next(".expanded").slidetoggle(500);             }         });          $(".expanded").mouseleave(function () {             if (readyforhovering) {                $(".expanded").slideup(500);                $(".collapsed").slidedown(500);             }                 });      }); 

you don't want user able hover until after 5 seconds has expired , have shown smaller image... that's point of readyforhovering variable.


Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -