Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 20.09.2017, 01:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

Webrow,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">


  .height{
    width:300px;
    height:3000px;
    background:#FFF;
  }

  .ret_block{
    height:65px;
    width:65px;
    position: fixed;
    opacity:0;
    right:100px;
    bottom: -70px;
  }
  .ret_block.up{
    transition:bottom 2s cubic-bezier(.35,1.88,.51,.97), opacity 3s ease-out;
    opacity: 1;
    bottom: 100px;
  }

  .ret{
    background:#80c111;
    opacity:0.9;
    border-radius: 50% !important;
    cursor:move;
    height:65px;
    position:absolute;
    width:65px;
    z-index:9999;
    cursor:pointer;
  }
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var a = $(".ret_block").addClass("up"),
        b,
        c = $(window).scrollTop();
    $(window).scroll(function() {
        window.clearTimeout(b);
        a.css({bottom : Math.min($(window).height()-65,Math.max(-65,c - $(window).scrollTop()) )  })
        b = window.setTimeout(function() {
            a.css({bottom : ""});
            c = $(window).scrollTop();
        }, 200)
    }).trigger("scroll")
});
  </script>
</head>

<body>
<div class="height">



 <div class="ret_block">
   <div class="ret"> </div>
 </div>



</div>

</body>
</html>

Последний раз редактировалось рони, 20.09.2017 в 08:45.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
FancyBox: Размер модального окна больше размеров окна браузера (высота), как сделать? clgs Events/DOM/Window 3 22.01.2015 17:13
Как проверить, что верхняя граница окна браузера пересекает элемент? Hurray Элементы интерфейса 2 04.04.2014 01:07
затемнение по высоте страницы, а не окна qazibum Общие вопросы Javascript 4 07.09.2012 09:37
Помогите с настройкой лайтбокс окна obormot Элементы интерфейса 1 03.02.2012 16:14
Плавное открытие окна. Flashton Элементы интерфейса 3 20.10.2010 16:00