Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   slideToggle с низу в верх! (https://javascript.ru/forum/jquery/35815-slidetoggle-s-nizu-v-verkh.html)

sssppp6 23.02.2013 08:37

slideToggle с низу в верх!
 
Здравствуйте, нужно сделать меню которое в самом низу страницы. Сейчас используется slideToggle(). При открытии оно откроется с верху в низ, мне нужно на оборот. Если позицию с top поменять на bottom то раскрывается как надо, но не в том месте

Нужно рассчитать положение Положение(используется position: absolute) этой менюшки на странице:
menu.appendTo('body').css({ 'left': pos.left, 'bottom': ????, 'display': 'none' });

danik.js 23.02.2013 08:50

Цитата:

Сообщение от sssppp6
не в том месте

Это как?

sssppp6 23.02.2013 09:10

Цитата:

Сообщение от danik.js (Сообщение 236543)
Это как?

Если скажем поставить bottom: 0, то меню получается в низу окна браузера, а если прокрутить страницу - он смещается. Вот как должно быть

danik.js 23.02.2013 09:53

Цитата:

Сообщение от sssppp6
а если прокрутить страницу - он смещается

Может тогда нужно ипользовать position:fixed?

sssppp6 23.02.2013 10:41

Цитата:

Сообщение от danik.js (Сообщение 236545)
Может тогда нужно ипользовать position:fixed?

Если так сделать и прокрутить страницу вверх, меню тоже уедет.

Deff 23.02.2013 11:00

<style>
<head>
* {
padding:0;
margin:0;
}
.wrp {
  position:absolute;
  border:red 1px solid;
  width:200px;
  height:100px;
  bottom:200px; /*Выставляем как надо*/
}
.toggle {
  border:blue 1px solid;
  width:100%;
  height:100%;
  position:absolute;
  margin-top:auto;
  margin-bottom:0!important;
  top:auto;
  bottom:0!important;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
 <script>
  $(document).ready(function(){

    $(".wrp").click(function () {
      $(".toggle").slideToggle("slow");
    });

  });
  </script>
</head>
<body style="height:100%">

<div class="wrp">
  <div class="toggle">Меню</div>
</div>


</body>


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