CSS Incompatible ? SP2007

CSS Incompatible ? SP2007 - HTML/CSS - Programmation

Marsh Posté le 09-09-2014 à 09:28:24    

Bonjour à tous,
 
J'ai un petit soucis avec SharePoint version 2007 (J'aimerais bien upgrade de SP mais je n'ai pas le choix.), en effet j'ai l'impression que la balise display ne fonctionne pas dans les Content Editor Web Part, je penche pour une incompatibilité du à la version 2007 :
 
Voici mon code :
 

Code :
  1. <html>
  2. <head>
  3.  <title>newhometest</title>
  4.  <style type="text/css">
  5.   #show div { display:none; }
  6.   #show .show { display : block; }
  7.  </style>
  8.  <script type="text/javascript">
  9.   toggle_div = function(bouton, id) {
  10.    var section = document.getElementById("show" );
  11.    var childSection = section.childNodes;
  12.    for(var i = 0; i < childSection.length; i++){
  13.     if(childSection[i].nodeType == 1){              childSection[i].className=childSection[i].className.replace("show","" );
  14.               if(childSection[i].id === id){
  15.                childSection[i].className = childSection[i].className + "show";
  16.               }
  17.     }
  20.     console.log(childSection[i].nodeType);
  21.    }
  22.     var div = document.getElementById(id);
  23.   }
  24.  </script>
  25. </head>
  27. <body>
  28.  <section id="works">
  29.  <div id ="imgo365">
  30.    <div style="float:left;margin-right:20px;" id="work_1" onclick="toggle_div(this,'show_1')"><a href="#show_1"><img src="test/img/outlook.png" alt="outlook"/></a></div>
  31.    <div style="float:left;margin-right:20px;" id="work_2" onclick="toggle_div(this,'show_2')"><a href="#show_2"><img src="test/img/o365.png" alt="o365"/></a></div>
  32.    <div style="float:left;margin-right:20px;" id="work_3" onclick="toggle_div(this,'show_3')"><a href="#show_3"><img src="test/img/lync.png" alt="lync"/></a></div>
  33.    <div style="float:left;margin-right:20px;" id="work_4" onclick="toggle_div(this,'show_4')"><a href="#show_4"><img src="test/img/workplace.png" alt="workplace"/></a></div>
  34.  </div>
  35.  </section>
  36.  <section style="clear: both;" id="show">
  37.   <br />
  38.   <br />
  39.   <div id="show_1">
  40.    Visible content 1
  41.   </div>
  42.   <div id="show_2">
  43.    Visible content 2
  44.   </div>
  45.   <div id="show_3">
  46.    Visible content 3
  47.   </div>
  48.   <div id="show_4">
  49.    Visible content 4
  50.   </div>
  51.  </section>
  53. </body>
  54. </html>


 
Si vous connaissez une solution ou autre chose d'équivalent je suis preneur.
 
 
Merci d'avance  mesdames, messieurs :)

Reply

Marsh Posté le 09-09-2014 à 09:28:24   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed