Charger une page web dans un div

asamaesal Messages postés 1 Date d'inscription   Statut Membre Dernière intervention   -  
RAD ZONE Messages postés 5230 Date d'inscription   Statut Contributeur Dernière intervention   -
Bonjour,
comment on peut en cliquant sur un élément de la barre de menus, la page s'affiche dans un DIV situé en dessous, sans actualiser complètement la page avec html /css .

1 réponse

Réponse 1 / 1
RAD ZONE Messages postés 5230 Date d'inscription   Statut Contributeur Dernière intervention   1 360
 
Voila une methode avec 
getElementById
a toi d adapter 

<!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>
    <title>RAD ZONE Webcreation
    </title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="author" content="http://radservebeer.free.fr" />
    <meta name="generator" content="PSPad editor, www.pspad.com" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <style type="text/css">
    /*<![CDATA[*/
     body{
  background-color:#555555;
  padding:0;
  margin:0
}

#sitemain{
  position:relative;
  width:1024px;
  height:800px;
  background-color:transparent;
  margin:auto
}



    /*]]>*/
    </style>
<script type="text/javascript">
//<![CDATA[
var subs_array = new Array("sub1");
function montrerSubs(la_sub){
        if (document.getElementById(la_sub).style.display==""){
        document.getElementById(la_sub).style.display = "none";return
  }
  for (i=0;i<subs_array.length;i++){
        var my_sub = document.getElementById(subs_array[i]);
        my_sub.style.display = "none";
        }
  document.getElementById(la_sub).style.display = "";
  }
//]]>
</script>
  </head>
  <body>
    <div id="sitemain">
      <br />
      <button onclick="montrerSubs('sub1')">IFRAME</button>
      <br />
      <div id="sub1" style="display:none">
        <iframe name="iframe" src="http://radservebeer.free.fr/" width="1024" height="600" frameborder="0"></iframe>
      </div>
    </div>
  </body>
</html>
1