Горизонтальная и другая направленная прокрутка

Question

Горизонтальная и другая направленная прокрутка

0

Я пытаюсь добиться горизонтального прокрутки с основным содержимым в центре div, но ссылки идут влево и вправо.

<div id="left">
Scrolls left
</div>

<div id="home">
Opens on this
</div>

<div id="right">
Scrolls right
</div>

Я нашел stackoverflow, который говорит о том же, но использование их решений не помогает мне. Также это было в 2012 году. Я надеюсь, что у нас есть лучшие способы сделать это сейчас. Схема горизонтальной прокрутки ВЛЕВО/ВПРАВО: jQuery/CSS-опрос

Эффект, который я, вероятно, хотел бы достичь, будет таким же, как http://steveandjacqs.com/

Есть ли какие-либо рекомендации по этому поводу? http://jsfiddle.net/gaby/en9sw/15/

РЕДАКТИРОВАТЬ:

В основном я хочу, чтобы сайт открывался на #home и переходил на #left, когда я нажимал ссылку, которая направляет на него.. (так что он будет прокручиваться влево при нажатии ссылки)

new_frontenddev 12 май 2014, в 19:57

Источник

0

Можете ли вы предоставить больше кода, эти div в посте никуда не движутся.
Teemu 12 май 2014, в 17:27
0

Да, они никуда не денутся, но я привел ссылки на то, что я пытался и пытался. Поток stackoverflow, который я связал, является единственной попыткой, близкой к тому, чего я хочу достичь, но я не могу заставить его работать на Chrome .. и он ломается
new_frontenddev 12 май 2014, в 17:29
0

Вы имеете в виду что-то вроде переполнения в CSS?
DOCTYPE HTML 12 май 2014, в 17:31
0

«Заблокированный контент» на jsFiddle, никогда раньше не видел ... В любом случае, пожалуйста, добавьте свой код в вопрос, чтобы мы могли увидеть, что на самом деле ломается. Никто не хочет путешествовать, чтобы узнать, что вам действительно нужно.
Teemu 12 май 2014, в 17:40
0

Заблокированный контент появляется, потому что Chrome нарушает код и продолжает обновляться, в любом случае, вот его отредактированная скрипка, и мне кажется, это тоже работает, jsfiddle.net/gaby/en9sw/15
new_frontenddev 12 май 2014, в 17:49
0

Я бы на самом деле предпочел бы, если кто-то знает, как справиться с результатом, который я ищу, чем дальше исследовать это сломанное решение.
new_frontenddev 12 май 2014, в 17:50
0

Кажется, работает в FF, и даже в IE. Тем не менее, лучше добавить код к вопросу.
Teemu 12 май 2014, в 18:08
0

Вы можете использовать jquery с scrollLeft при нажатии на ссылку.
Medda86 12 май 2014, в 18:10

Показать ещё 6 комментариев

Теги:

javascript

jquery

css

scroll

1 ответ

Ещё вопросы

Можете ли вы предоставить больше кода, эти div в посте никуда не движутся.
Да, они никуда не денутся, но я привел ссылки на то, что я пытался и пытался. Поток stackoverflow, который я связал, является единственной попыткой, близкой к тому, чего я хочу достичь, но я не могу заставить его работать на Chrome .. и он ломается
Вы имеете в виду что-то вроде переполнения в CSS?
«Заблокированный контент» на jsFiddle, никогда раньше не видел ... В любом случае, пожалуйста, добавьте свой код в вопрос, чтобы мы могли увидеть, что на самом деле ломается. Никто не хочет путешествовать, чтобы узнать, что вам действительно нужно.
Заблокированный контент появляется, потому что Chrome нарушает код и продолжает обновляться, в любом случае, вот его отредактированная скрипка, и мне кажется, это тоже работает, jsfiddle.net/gaby/en9sw/15
Я бы на самом деле предпочел бы, если кто-то знает, как справиться с результатом, который я ищу, чем дальше исследовать это сломанное решение.
Кажется, работает в FF, и даже в IE. Тем не менее, лучше добавить код к вопросу.
Вы можете использовать jquery с scrollLeft при нажатии на ссылку.

Medda86 · Accepted Answer · 2014-05-12T17-27-00.000Z

1

Лучший ответ

Я сделал это для вас http://jsfiddle.net/medda86/YbW92/

HTML

<div class="left">Scrolls left</div>
<div class="right">Scrolls right</div>

<div class="content">
    <div class="page">test1</div>
    <div class="page">Home opens on this</div>
    <div class="page">test3</div>
</div>

Medda86 12 май 2014, в 17:27

0

Спасибо, я ценю это. Но то, чего я пытался достичь, это то, что дом был бы центральным делом, а значит домом! - со ссылками влево и вправо .. Левые прокрутки влево .. и справа на право
new_frontenddev 12 май 2014, в 18:36
0

Не за что ... Да, вы можете изменить его, центрировав свой домашний div и загрузить его таким образом ... И создавать собственные события для ваших левых и правых ссылок.
Medda86 12 май 2014, в 18:39
0

Кстати, вы имеете в виду прокрутку содержимого внутри centerdiv или прокрутку всей страницы?
Medda86 12 май 2014, в 18:44
0

Я не знаю Jquery достаточно для пользовательского кода. Я действительно новичок в этом.
new_frontenddev 12 май 2014, в 18:45
0

Вся страница .. увидеть этот сайт? steveandjacqs.com открывается в центре дома div. но у него есть div слева и справа и снизу .. Я не могу понять, как он достиг этого
new_frontenddev 12 май 2014, в 18:56
0

@ user2861086 Кажется, они используют этот маленький плагин .
Teemu 12 май 2014, в 19:17
1

Я обновил скрипт для вас.
Medda86 12 май 2014, в 19:38
0

Отлично! но я не хочу, чтобы "правильная ссылка" просто переходила к следующему правильному div. Если бы мне пришлось связать теги на основе тегов div или якоря на странице? как вправо (на навигационной панели) переходит к div "test3" как обычная навигационная функция .. за исключением того, что в этом случае мне понадобится одна для прокрутки влево, а другая для прокрутки вправо .. Большое спасибо за помощь мне ..
new_frontenddev 12 май 2014, в 22:26
0

Пожалуйста :)
Medda86 13 май 2014, в 04:07
0

Медда, есть еще проблема, потому что в этом случае левая и правая ссылки действуют как кнопки вперед и назад. но в моем случае я хочу, чтобы они были навигацией к определенному якору на странице, как на этом сайте steveandjacqs.com .. поэтому каждая ссылка будет прокручиваться в своем разделе. но домашний div - это тот, что посередине, и есть одна секция перед домом, которая прокручивается слева. и один раздел после дома, который прокручивает прямо.
new_frontenddev 13 май 2014, в 15:47
0

На самом деле, оглядываясь назад, ваш код делает именно то, что делает пример сайта. Но есть ли способ, которым я мог бы напрямую отвести моего пользователя в раздел 3, не возвращаясь к дому снова? Код работает на мой код, я просто запутался :(
new_frontenddev 13 май 2014, в 17:09
1

Ок я обновил :)
Medda86 13 май 2014, в 17:33
0

Это работает лучше! автоматически ли это делает каждую секцию равной высоте, потому что мой левый div имеет более длинный контент, и поэтому он добавляет длину моему homediv :(
new_frontenddev 13 май 2014, в 17:51
0

да, каждая секция имеет одинаковую высоту ... Я обновил и добавил scrolltop: 0, чтобы он прокручивался вверх, когда вы переходите к другому div.
Medda86 13 май 2014, в 18:20
0

Привет @ Medda86 как дела? Спасибо за вашу помощь в этом, у меня есть веб-сайт и работает с тех пор, как вы помогли мне в 2014 году. Однако у меня был странный сбой. На большинстве компьютеров в первый раз - сначала он отображается на левом слайде и только при обновлении открывается на слайде CENTER. ты случайно не знаешь как это исправить ???
new_frontenddev 17 март 2016, в 22:40
0

вот сайт: minhasdistillery.com/chinookwhisky
new_frontenddev 17 март 2016, в 22:50

Показать ещё 14 комментариев