Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Боковое меню на js (https://javascript.ru/forum/misc/42875-bokovoe-menyu-na-js.html)

steepfellow 12.11.2013 18:15

Боковое меню на js
 
Добрый вечер, подскажите как сделать так чтобы можно была кликнув по ссылке открывалось боковое меню (слева), при клике по той же ссылке, оно закрывалось, и при переходе по страницам меню не закрывалась ??помогите пожалуйста..

Faab 12.11.2013 18:20

А у вас уже есть HTML заготовка для меню?

steepfellow 12.11.2013 18:31

есть с html проблем нет этот язык я достаточно знаю, вот js код тока нужен

Faab 12.11.2013 18:33

ну покажите тогда ваше меню :) (просто html, без JS)

steepfellow 12.11.2013 18:38

вот, а при чем тут мое меню мне же нужен js код







<div id="left_block">


<div id="box" style="display: none">




<ul class="link_block">


<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>

<li><a class="link" href="/#">Главная</a></li>


</ul>


</div>

</div>

steepfellow 12.11.2013 18:42

в диве <div id="box" style="display: none">

display: none

потому что у меня есть код js который мне нужен только когда при переходах на другие страницы этот блок меню закрывается
вот код

<script type="text/javascript">

function openbox(id){
    display = document.getElementById(id).style.display;
    if(display=='none'){
       document.getElementById(id).style.display='block';
    }else{
       document.getElementById(id).style.display='none';
    }
}

</script>

Faab 12.11.2013 18:54

Попробуйте так:
function openbox(id){
display = document.getElementById(id).style.display;
  if(display=='none'){
    document.getElementById(id).style.display='block';
    localStorage["menuLeft"] = "block";
  }else{
    document.getElementById(id).style.display='none';
    localStorage["menuLeft"] = "none";
  }
}

window.onload = function(){
  if(localStorage["displayMenuLeft"] != "undefined"){
    document.getElementById(id).style.display = localStorage["menuLeft"];
  }else{
    localStorage["displayMenuLeft"] = "block";
  }  
}

steepfellow 12.11.2013 19:13

а ссылка правильная ? <a href="#" onclick="openbox('box'); return false"></a>

steepfellow 12.11.2013 19:21

твой код не помог все так же и осталось:(

Faab 12.11.2013 19:55

<script>
window.onload = function(){
  if(localStorage["displayMenuLeft"] != "undefined"){
    document.getElementById('box').style.display = localStorage["menuLeft"];
  }else{
    localStorage["displayMenuLeft"] = "block";
  };
  eLinkDriver = document.getElementById('linkDriver');
  eLinkDriver.onclick = function(){
    display = document.getElementById('box').style.display;
    if(display=='none'){
      document.getElementById('box').style.display='block';
      localStorage["menuLeft"] = "block";
    }else{
      document.getElementById('box').style.display='none';
      localStorage["menuLeft"] = "none";
    }
  };  
}
</script>
<div id="left_block">
  <span id="linkDriver" style="cursor: pointer;">Show/Display</span>
  <div id="box" style="display: none">
    <ul class="link_block">
      <li><a class="link" href="/#">Главная</a></li>  
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li>  
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li> 
      <li><a class="link" href="/#">Главная</a></li>
      <li><a class="link" href="/#">Главная</a></li>
    </ul>
  </div>
</div>


Часовой пояс GMT +3, время: 16:02.