html-прокрутка: перейти к концу страницы (по горизонтали) с помощью javascript?

Есть ли скрипт, который перейдет на страницу до горизонтального конца.

Пользователь может нажимать "Домой" и "Конец" на клавиатуре, чтобы перейти к верхней и нижней части веб-страницы, но как насчет правого и левого?

Как избавить пользователя от неудобства, связанного с прокруткой до самых дальних глубин прокрутки x

2 ответа

Решение

Горизонтальная прокрутка является довольно редкой ситуацией, так как, естественно, браузер будет пытаться выполнять вертикальную прокрутку, если не изменяемые размеры действительно не переполняют видимую область; Таким образом, я предполагаю, что вы находитесь в явно горизонтальном дизайне, таком как один из них: http://webdesignledger.com/inspiration/40-of-the-best-horizontal-scrolling-websites

В любом случае, основа одна и та же: поймайте какое-нибудь ключевое * событие и делайте что хотите.

Поймай событие и запусти функцию прокрутки:

document.body.addEventListener('keydown', scrollfct, true);

Первое предупреждение: нажатие клавиши не будет захватывать специальные символы, такие как вверх / вниз и т. Д., Поэтому используйте "keydown" или "keyup"

Теперь функция прокрутки:

function scrollfct(e) {
   console.log(evt.keyCode); /* this will debug that your function is being called, and will help you get the keyCodes you want. Remove in production :-) */
   var HOME_LEFT = 33; //HOME
   var HOME_RIGHT = 34; //END
   if (e.keyCode == HOME_LEFT) {
       window.scroll(0,0);
   };
   if (e.keyCode == HOME_RIGHT) {
       window.scroll(document.body.scrollWidth,0);
   }
}

Для документа window.scroll: https://developer.mozilla.org/en/Window.scroll

Второе предостережение: чтобы быть полностью кросс-браузерным, вам придется сделать домашнее задание.

Если вы хотите иметь дело с колесом мыши или хотите плавную прокрутку, проверьте это: http://paulicio.us/items/view/24/horizontal-page-scrolling-using-javascript или с помощью jQuery: http://tympanus.net/codrops/2010/06/02/smooth-vertical-or-horizontal-page-scrolling-with-jquery/ ИЛИ просто используйте HTML5 CSS-переходы.

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

<a href="#overtotheright">Goto the Right</a>
. . .
<div id="overtotheright"> . . . </div>

Или в javascript, следующее должно работать.

window.scrollTo(document.body.scrollWidth, 0);
Другие вопросы по тегам