What's a preloader?
Preloaders is also known as loaders. Preloaders are what you see on the screen while the rest of the page's content is still loading. Preloaders are often simple/complex animations that are used to keep visitors entertained while server operations finish processing.
Adding preloader with some simple steps:
Step 1: Copy the following code and paste in your website.
Step 2: Add the Jquery.js file
Step 3: Add images
In this video, I'm showing all the steps to add Preloader in Website Using HTML CSS and JQuery in live project.
Preloaders is also known as loaders. Preloaders are what you see on the screen while the rest of the page's content is still loading. Preloaders are often simple/complex animations that are used to keep visitors entertained while server operations finish processing.
Adding preloader with some simple steps:
Step 1: Copy the following code and paste in your website.
<html>
<head>
<title>Image Loader</title>
<script src="js/jquery.js"></script>
<script language="javascript">
$('document').ready(function(e) {
$(".preLoader").fadeOut(2500);
$(".content").fadeIn(4000); });
</script>
<style>
.content{
display: none;
}
.preLoader{
position: fixed;
left: 0px;
top: 0px;
width:100%;
height:100%;
z-index: 9999;
background: url(images/Preloader_3.gif) 50% 50% no-repeat rgb(249,249,249); }
</style>
</head>
<body>
<div class="preLoader"></div>
<h1 class="content">Please subscribe our channel for more videos</h1>
</body>
</html>
Click the following link to get jquery.js file
Click the following link to get Images file
EmoticonEmoticon