Bonjour, voila j'utilise une simple fonction de chargement de div en javascript , le petit soussis c'est que j'aimerai y rajouter un préload de chargement.
Comme vous pourrez vous en appercevoir en cliquant sur le lient 1 dans le code si dessous, la page "page1.html" se charge dans le div "frame1" mais sans preload
Alors si qq pourait m'aider pour que se petit script intègre un préload cela me dépanerait beaucoup.....
Voici mon code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DEMO + TEST LOADING</title>
<script type="text/javascript">
function envoieRequete(url,id)
{
var xhr_object = null;
var position = id;
if(window.XMLHttpRequest) xhr_object = new XMLHttpRequest();
else
if (window.ActiveXObject) xhr_object = new ActiveXObject("Microsoft.XMLHTTP");
// On ouvre la requete vers la page désirée
xhr_object.open("GET", url, true);
xhr_object.onreadystatechange = function(){
if ( xhr_object.readyState == 4 )
{
// j'affiche dans la DIV spécifiées le contenu retourné par le fichier
document.getElementById(position).innerHTML = xhr_object.responseText;
}
}
// dans le cas du get
xhr_object.send(null);
}
</script>
<style type="text/css">
<!--
.Haut {
width: 800px;
margin-right: auto;
margin-left: auto;
}
.frame1 {
width: 800px;
margin-right: auto;
margin-left: auto;
}
.frame2 {
width: 800px;
margin-right: auto;
margin-left: auto;
}
-->
</style>
</head>
<body>
<div class="Haut"> Menu: <a href="#" onclick="envoieRequete('page1.html','frame1');" >Lien 1 </a>- <a href="#" onclick="envoieRequete('page2.html','frame2');" >Lien 2</a></div>
<div class="frame1"></div>
<div class="frame2"></div>
</body>
</html>