Страница 2 из 2 < 1 2
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   плавный скролл при нажатии на кнопки клавиатуры(вниз, вверх) (https://javascript.ru/forum/misc/71901-plavnyjj-skroll-pri-nazhatii-na-knopki-klaviatury-vniz-vverkh.html)

рони 27.12.2017 19:49
Цитата:
Сообщение от JohnJohn
событие срабатывает на каждый индекс массива
только один элемент может быть всех ближе к верху окна, только предыдущему этого элемента (или следующему) будет скролл. в чём проблема?

рони 27.12.2017 20:03
Цитата:
Сообщение от JohnJohn
var a = $("div").index(b[0]);
b[0] это всегда разный элемент, тот который ближе к верху, это происходит в результате сортировки.

если и куда-то можно втиснуть цикл, то это заменить сортировку циклом. так будет быстрее даже за счёт break.

рони 27.12.2017 20:14
JohnJohn,
Задача №1. (по желанию)

<!DOCTYPE HTML>
<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  *{
    margin: 0;
    padding: 0;
  }

  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>
window.addEventListener("DOMContentLoaded", function() {

  var b = document.querySelectorAll("div");
  document.addEventListener("keydown", function(e) {
  for (var i=0; i < b.length; i++)  {
     //ваша задача остановить цикл на элементе который всех ближе к верху окна
  }

  alert(i + 1);
  });
});
  </script>

</head>

<body>
<div id="d1" >1&uarr; &darr; </div>
<div id="d2" >2</div>
<div id="d3" >3</div>
<div id="d4" >4</div>

</body>

</html>

JohnJohn 28.12.2017 02:29 
<!DOCTYPE HTML>
<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  *{
    margin: 0;
    padding: 0;
  }

  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>
window.addEventListener("DOMContentLoaded", function() {

  var b = document.querySelectorAll("div");
  document.addEventListener("keydown", function(e) {
  for (var i=0; i < b.length; i++)  {
if (window.pageYOffset < (b[i].getBoundingClientRect().top + window.pageYOffset)) break;
     
  }

  alert(i);
  });
});
  </script>

</head>

<body>
<div id="d1" >1&uarr; &darr; </div>
<div id="d2" >2</div>
<div id="d3" >3</div>
<div id="d4" >4</div>

</body>

</html>

рони 28.12.2017 02:46
JohnJohn,
:dance:

рони 28.12.2017 02:48
JohnJohn,
только уберите лишнее из строки 25

JohnJohn 28.12.2017 03:06
не могу понять, что лишнее) break на 26 перенести?)

рони 28.12.2017 03:19
JohnJohn,
то что одинаково в сравнении, можно сократить, вычитанием из обоих частей сравнения.

рони 28.12.2017 03:35
JohnJohn,
5 < y + 5 == 0 < y

JohnJohn 28.12.2017 03:40
рони,
понял) ну как все напишу, там обязательно уберу, а так пусть будет, что бы людей не путать) спасибо


Часовой пояс GMT +3, время: 23:50.
Страница 2 из 2 < 1 2
Показывать 40 сообщений этой темы на одной странице