Показать сообщение отдельно
  #7 (permalink)  
Старый 13.10.2013, 22:18
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Zhazhah,
Вариант ... скролл к ближайшему s - вниз, w - вверх - кликнуть по документу 1 раз в начале
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div{width:100%}
  #d1{background:#00F;height:700px;border:1px solid}
  #d2{background:#FF0;height:500px;border:1px solid}
  #d3{background:#F0F;height:300px;border:1px solid}
  #d4{background:#F00;height:600px;border:1px solid}
  </style>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script>
    $(document).ready(function () {
        var b = [];
        $("div").each(function (c, d) {
                b[c] = [$(d).offset().top, $(d).height()]
            });
        $(document)
            .keyup(function (c) {
                if (87 == c.which || 83 == c.which) {
                    for (var d = $(document).scrollTop(), a = 0; a < b.length && !(b[a][0] + b[a][1] > d); a++);
                    a = 83 == c.which ? ++a : --a;
                    0 > a && (a = 0);
                    a >= b.length && (a = b.length - 1);
                    $("body,html").animate({scrollTop: b[a][0]}, 400);
                    return !1
                }
            })
        });
  </script>
</head>
<body>
<div id="d1" >1</div>
<div id="d2" >2</div>
<div id="d3" >3</div>
<div id="d4" >4</div>
</body>
</html>
Ответить с цитированием