For smart Primates & ROBOTS (oh and ALIENS ).

Blogroll

Friday, July 11, 2014

Display content with delay in jquery

Display content with delay in jquery

Some time you want to show some data with delay, then use the listed below code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Display content with delay</title>
<style>
.my-class {
    display: none;
}
</style>
<script language="javascript" src="jquery-1.10.2.js" type="text/javascript"></script>
</head>
<body>
<div class="my-class">
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
  <p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
</div>
</body>
<script>
$(document).ready(function() {
$('.my-class').delay(1000).fadeIn(3500);
});
</script>
</html>
Share:

0 comments:

Post a Comment

Multiple attribute passing in querySelectorAll

Multiple attribute passing in querySelectorAll     Here I am demonstrating code to how to pass multiple attributes in querySelectorAll. <...

Ads Inside Post

Powered by Blogger.

Arsip