Saturday 12 November 2016

REFRESH DIV CONTENT WITHOUT RELOADING PAGE USING JQUERY AND PHP

jQuery Auto Load and Refresh Div on Ajax Call Without Reloading, Jquery has been useful for a lot of reasons, here we are using jquery for auto refresh div every 2 seconds, depends, now we are using that same method to create a slide show for multiple image on a web page. share if found other resources

This Refresh DIV Content Without Reloading Page using jQuery,

Demo Download
The code below perform Auto Load and Refresh Div every two 2 seconds

index.html
Simple jquery code that load the swap.php to #screen id on div container

<script src="https://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
setInterval(function(){
$("#screen").load('swap.php')
}, 2000);
});
</script>
<!-- ########## start display ##########-->

<div id="screen"></div>

<!-- ############ end start display ############-->

swap.php

<?php
$bg_array = array("img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg");
$bg = array_rand($bg_array,1);
?>
<img src="<?php echo $bg_array[$bg];?>"/>

This file contain images for slide in array format, using array_rand to display one after the other, i had developed like this with jQuery and php just few line of code.

Demo Download
Found this post helpful? share...