Loading Pages Using Jquery

Loading Pages Using Jquery Web-development (jquery) Loading Pages Using Jquery

Loading Pages Using jquery

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { content(); topbanner(); sidebanner(); function content() { $.ajax({ type: "POST", url: "content.php", data: "" , beforeSend: function() { $("div#content").html('<span>Loading...</span>'); }, cache: false, success: function(data){ $("#content").html(data); } }); } function topbanner() { $.ajax({ type: "POST", url: "topbanner.php", data: "" , beforeSend: function() { $("div#topbanner").html('<span>Loading...</span>'); }, cache: false, success: function(data){ $("#topbanner").html(data); } }); } function sidebanner() { $.ajax({ type: "POST", url: "sidebanner.php", data: "" , beforeSend: function() { $("div#sidebanner").html('<span>Loading...</span>'); }, cache: false, success: function(data){ $("#sidebanner").html(data); } }); } }); </script> <style> body { font-family:Arial, Helvetica, sans-serif; } #main { width:400px; border:solid 2px #dedede; margin-top:30px; height:400px } #topbanner { height:100px; border-bottom:solid 2px #dedede } #content { float:left;width:260px; height:400px } #sidebanner { float:left;width:130px; height:300px;border-left:solid 2px #dedede } .loading { color:#cc0000; } </style> <div> <div></div> <div></div> <div></div> </div> 

 <?php //content.php echo '<h2>Content.</h2> '; ?> 

 <?php //topbanner.php echo 'Top Banner'; ?> 

 <?php //sidebanner.php echo 'Side Bar'; ?> 

• Spicy Tamarind Black Beans
Sun-Dried Tomato Vinaigrette
Parmesan Potato Puff
Cream Cheese Sugar Cookies
Dumplings in Blueberry Syrup
Spiced Urad Dal Rice
Turkish Sour Cherry Pilaf
Red Kidney Bean Summer Salad
Turkish Yogurt Hummus
Pine Nut and Orange Wild Rice

Posted by Hodie J