Показать сообщение отдельно
  #3 (permalink)  
Старый 28.12.2014, 15:46
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

http://learn.javascript.ru/play/vgLobc

<!DOCTYPE HTML>
<html>
  <head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
    <style type="text/css">
      body, html {
        height: 2000px;
      }
      #block {
        bottom: 20px;
        display: none;
        position: fixed;
        right: 20px;
      }
    </style>
  </head>
  <body>
    <div id="block">BLOCK</div>

    <script type="text/javascript">
      $(function(){
          var block = $('#block'),
              visible;
          $(window).scroll(function() {
              var a = $(this).scrollTop(),
                  b = a > 400 && a < $(document).height() - this.innerHeight - 200;
              if(b && !visible) {
                  block.fadeIn(200);
                  visible = true;
              }
              else if(!b && visible) {
                  block.fadeOut(200);
                  visible = false;
              }
          });
      });
    </script>

  </body>
</html>

Последний раз редактировалось ruslan_mart, 28.12.2014 в 15:49.
Ответить с цитированием