开发者

Javascript show example of a chose

I've got a dropdownbox with 10 options, and when you click an option, I want it to show an example of what you choose. The option is how many menu bars/divs you would like, and the example is in <div id="example"></div>, my question is, do I have to enter all div's with a loop and enter all width's and height's for every single div? (that would be a VERY large CSS file)

I'm using javascript for which option have been choose. Example :

<script>
function header(dropdown)
{
 var myindex_H = dropdown.selectedIndex;
 var waarde_H = dropdown.options[myindex_H].value;

 if(waarde_H == "Menu H 1")
 {
     document.getElementById("option1").style.display = "";
 }
}
</script> 

Remember I'm using a loop, this is just an example of only 1 div

<table>
   <tr>
     <td>
     <form action="index.php" method="POST">
          <b>Menu : </b>
          <select name="Menu" onKeyUp="menu(this.form.Menu);">
          <option> - - - -</option>
          <?php
               for($a = 1;$a <= 10;$a++) { print '<option>Menu H '.$a.'</opti开发者_C百科on>'; }
          ?>
          </select>
     </form>
     </td>
     <td>
          <div id="example" >
             //Create div that shows the example
             //I use a PHP loop for this, but I use an example now for only 1 div
             <div id="option1" style="display: none;">
                  <div class="example-menu-bar1">
                  </div>
             </div>
              //all div's inside here for every option
              //example : option 1 have 1 div
              //          option 2 have 2 divs
              //          .....................
              //          option 10 have 10 divs
          </div>
     </td>
  </tr>
<table>

Everything works, only my main problem is that in my CSS code, I need to make a class for every option, because every option have diferent width's. So the question is, is there a smarter and faster way for this?

I hope to hear from you soon, thanks for reading :)

Kind regards,

Jeroen

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜