Refresh Div tag using Jquery Mobile
Refresh Div tag using JavaScript is very easy to write.As you are seeing below I write a function Load_external_content() in which a Div tag i.e #data will load the refresh.php file in a fadeout effect.
Now it's time to see the working of second function as you can see below I set the setInterval function
which will call again and again after the interval of 10 seconds.Most probably you can use this code in your projects.
<html>
<head > <!-- including all files of JQUERY -->
<link rel="stylesheet" href="js/jquery.mobile-1.4.5.min.css"><head > <!-- including all files of JQUERY -->
<script src="js/jquery.js"></script>
<script src="js/index.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<title>Refresh DIV Tag in 10 seconds</title>
<Script>
function Load_external_content() // A function which will load the refresh.php file in fading manner
{
$('#data').load('refresh.php').fadeout(10000);
}
$(document).ready(function()
{
setInterval(function() { Load_external_content(); }, 1000); // this function recall the Load_external_content() function in every 10 seconds
});
</script>
</head>
<body>
<p style="font-family:Arial;color:black;font-size:20px;">Refresh DIV Tag in 10 seconds</p>
<div id="data" style="border:1px dotted grey;width:50%;">
/* A refresh.php file will call after 10 seconds */
</div>
</body>
</html>
Comments
Post a Comment