AJAX: Loading Preloader Animation Image
AJAX Tutorial: In this post, we add something that make user know ajax still works. We called preloader. It will help user to know where part of page will change. It also add more attractive to our web.
You can use many preloader like this:



Ok, we try to use it. Open test.php in previous practice. Replace with following code:
<html>
<head>
<SCRIPT language="JavaScript" SRC="ajax.js"></SCRIPT>
</head>
<body onload="callAJAX('home.html','displaydiv' , '<center>
<img src=loading6.gif></center>')">
<a href="#" onclick="callAJAX('home.html','displaydiv', '<center>
<img src=loading6.gif></center>')">Home</a>
<a href="#" onclick="callAJAX('news.html','displaydiv', '<center><img
src=loading6.gif></center>')">News</a>
<a href="#" onclick="callAJAX('about.html','displaydiv', '<center><img
src=loading6.gif></center>')">About</a>
<table>
<tr>
<td id="displaydiv"></td>
</tr>
</table>
</body>
</html>
| Series this article: AJAX : Understanding AJAX AJAX: Shortcut to AJAX AJAX: Loading Web Content from Links AJAX: Loading Preloader Animation Image Tag: ajax Category: PHP Basic Post : December 27th 2007 Read: 10,060 blog comments powered by Disqus |
