timed display of div

all i need is some client side code jQuery or JS that will alter the divs style after X seconds

like visibility : hidden; OR max-height : 50px;

or switc开发者_如何学Pythonh the class \ id of the DIV ( preferred )

Use setTimeout

setTimeout(function(){
  // Change the style here... If using jQuery, it turns
  $('#my_divs').css({'visibility':'hidden', 'max-height':'50px'})
  // or
  $('#my_divs').addClass('my-custom-class');
}, x_seconds);

Plain JavaScript solution:

setTimeout(function() {
  document.getElementById('your_div_id').className = 'new_class_name';
}, X * 1000); // X = number of seconds

$(document).ready(function(){
    setTimeout('changeStyle()', 1000); //milliseconds
});

function changeStyle() {
    //do something useful
}

Here is one method that I use on a current production website.

$("#divStampWrapper").delay(1500).fadeIn("fast").delay(2500).animate({ top: -250 }, 2500).delay(2500).fadeOut("slow");

Explanation: Basically it grabs the div which holds an image, waits 1.5 seconds and then starts fading it in to view. Once the fade in effect is finished, it waits another 2.5 seconds and starts moving it upward to the new top position. It then waits another 2.5 seconds and starts a fade out. I know it's a bit more than you asked for, but it's a good example of what can be done with the timer.

IF u wanna show time after some sec again and again then use

setIntervel('changeStyle()',1000);

and u just wanna use time just once then use

setTimeout('changeStyle()',1000);
function changeStyle() {
 // code to display time
}