Нужно сделать карусель которая будет листаться колемиком мышки и слайдом на смартфоне. Как мне сделать его? Какие есть идеи? для начала нужно что бы хотя бы колесиком.
я пробовал уже. Дело в том что нужно скролить в лево и вправо а не в верх и вниз. а что бы скролить в стороны нужно нажимать шифт. Пробовал с имитацией шифта не получилось не работало. --- Добавлено --- я думал может к мышке прикрутить блок 10 на 10 пх. а в нем будет блок высота которого равна длине карусели. и при наведении на блок с каруселью крутить скрол в блоке который за мишкой бегает. и так изменять положение в блоке с каруселью. но не знаю как прилепить блок этот к мышке
Ох и костыли костыльные, один костыль другим погоняет. А может быть все гораздо проще? Топорный пример, конечно, и написан за 10 минут, и правильней было бы юзать трансформации, а не смещения, но суть, думаю, ясна.
Да все я переписал сделал все норм. Толкьо есть вопрос еще один почему увеличивается число не так как нужно когда быстро крутишь. оно получается в конце дробное. а должно быть целое и постоянно разное в конце получается Вот код. Код (Javascript): var left_li = $(carousel).find('li').position().left; $(this).find('li').css('left',''+left_li - 188+'px');
Я вообще думал, что должно быть не такое смещение, как у меня, чисто показать, что оно возможно, а по факту сработки события перелистывать слайд. То есть, дергать некое событие, вызывающее его смену. Насчет дробных чисел - хз, мб что делаете не так.
ВОт именно то что вы сделали ономне подходит. ок пускай сдробними. а как определить что он вкрай вперся в правый либо в левый? --- Добавлено --- Все решил вот таким способом округляю и перевожу в интегер оказалось это вот эта строка дает дробное Код (Javascript): var left_li = $(carousel).find('li').position().left;
На будущее и на всякий случай, когда вам нужно определить, вперся ли в край, ни в коем случае не используйте ==. Используйте <= и >=. Чтобы учесть случай, когда, по какой-то причине, на момент срабатывания события смещение будет за краем. Например, чтобы потом инициировать анимацию возврата элемента к краю, как в скорллах на телефоне, например.
Да я так и сделал. А вот наткунлся на проблему когда кручу карусель крутится и вся страница. Убрал канечно что бы при наведении для боди overflow hidden стало. Но это не изящно. как можно по другому сделать. кстати для тачей я просто прикрутил flexislider.
А я для тачей написал собственную библиотеку. Теперь знаю досконально, как это все работает и какая жопа этот ваш зум двумя пальчиками... Юзать не смещения координат и отступов, а CSS-трансформации.
но это ведь не решит проблему. я говорю о том что у этого блока с каруселью нет вертикального скрола только горизонтальный. из за этого браузер просто дальше прокручивает страницу в низ. вот об этом я говорю.
А понял. В таком случае перехватывайте событие onScroll над каруселью, отменяйте его всплытие, будет вам счастье.
Ха) жестко))) Но не более чем proof of concept как по мне. Ограничений слишком много. Да и не везде можно скроллом через CSS играться. Но интересно, да.