Picnic Website Code Tutorials

jQuery CSS With Delay

5/15/2013

View Demo

Expect Delays

This is how you add CSS with jQuery while using a delay when adding it. Both show how to use "multiple css rules". Both of the following assume you have linked to the jQuery library. Here are 7 other ways to add CSS with javascript.

Method 1: Just JS

HTML

<div id="one"></div>
		

JS

setTimeout(function() {
   $('#one').css({
      height:'200px',
      width:'500px',
      background:'red'
   });
}, 1500);
		

Method 2: with a class

CSS

.me {
height:200px;
width:500px;
background:blue;
margin-top:20px;
}
		

HTML

<div id="two"></div>
		

JS

setTimeout(function(){$('#two').addClass('me')},2500);
		

Sponsors

Top Donators

Friends of Mine