Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Изменения при достижении конца страницы! Код прикрепляю (https://javascript.ru/forum/dom-window/66377-izmeneniya-pri-dostizhenii-konca-stranicy-kod-prikreplyayu.html)

Danilkin500 11.12.2016 21:14

Изменения при достижении конца страницы! Код прикрепляю
 
Всем привет! Подскажите пожалуйста (в серпе не нашел), такого либо не запрашиваю, либо я один задался вопросом.

Есть скрипт, который позволяет делать движухи проскролив 100 точек от верха.

Как, подскажите как сделать так, чтобы движуха была при остатке до конца страницы 100. То есть не пролистав от верха страницы 100, а когда осталось листать до конца страницы 100 точек.

Вот код:

<script>
$(function(){
 $(window).scroll(function() { 
  var top = $(document).scrollTop();
  if (top > 100) $('.floating').addClass('fixed');
  else $('.floating').removeClass('fixed');
 });
});
</script>


Заранее спасибо всем спецам!

рони 11.12.2016 21:40

Danilkin500,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .floating.fixed  {
    position: fixed;
    top: 50px;
  }
  body{
    height: 2000px;
  }
 .floating{
   position: relative;
   background-color:  #FF0000;
 }

  </style>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

<script>
$(function(){
 $(window).scroll(function() {
  var top = $(document).scrollTop() + $(window).height()+ 100;
  if (top > $(document).height()) $('.floating').removeClass('fixed');
  else $('.floating').addClass('fixed');
 });
});
</script>

</head>

<body>
<div class="floating fixed">123</div>

</body>
</html>

Danilkin500 12.12.2016 10:30

Спасибо! Вы очень помогли. Решение работает!

Danilkin500 12.12.2016 10:44

правда при приближении к концу страницы блок мерцает как лапочка на елке. вроде все как надо, но мигание перечеркивает все

Danilkin500 12.12.2016 10:48

Что вообще мне нужно? Мне нужно сделать чтобы форма для комментирования была плавающей до тех пор, пока она не приблизится до места своего законного нахождения (cms wordpress).

Этот вариант работает, блок фиксируется, а при приближении перескакивает на свое место, но все это происходит с ярым миганием, а иногда блок почему то зависает, а страница не пролистывается до конца, показав только половину формы для комментирования.

DivMan 12.12.2016 10:50

Выложить весь код

Danilkin500 12.12.2016 10:57

все ясно. все это происходит, когда нет четко заданной высоты body
я это убрал:

body{
    height: 2000px;
}


И после началось мигание и зависание.
Но когда прописал, то все ровно стало двигаться. Но вы ведь понимаете, что у страниц высота всегда разная. Как тут быть?

Danilkin500 12.12.2016 11:09

у меня пустой шаблон. тут скачал _http://dontforget.pro/wordpress/chistyiy-shablon-wordpress-dlya-razrabotki-2-0/

там ничего нет, чтобы могло мешать

рони 12.12.2016 11:19

Danilkin500,
не осилил ваши тексты, но может это чем поможет.
http://javascript.ru/forum/dom-windo...d-futerom.html

Danilkin500 12.12.2016 11:22

Цитата:

Сообщение от рони (Сообщение 437800)
Danilkin500,
не осилил ваши тексты, но может это чем поможет.
http://javascript.ru/forum/dom-windo...d-futerom.html

Осиливать там ничего не нужно) вот самое важное... Не могу с этим разобраться.

Цитата:

все ясно. все это происходит, когда нет четко заданной высоты body
я это убрал:

body{
    height: 2000px;
}



И после началось мигание и зависание.
Но когда прописал, то все ровно стало двигаться. Но вы ведь понимаете, что у страниц высота всегда разная. Как тут быть?



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