Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 07.10.2017, 13:37
Интересующийся
Отправить личное сообщение для breeze125 Посмотреть профиль Найти все сообщения от breeze125
 
Регистрация: 04.09.2017
Сообщений: 12

Сообщение от рони Посмотреть сообщение
$(function() {
$(".main-list").on("click","a", function (event) {
 event.preventDefault();
 if($(window).width() > 767){
   var id = $(this).attr('href'),
 top = $(id).offset().top;
 $('body,html').animate({scrollTop: top-50}, 2000);
 }
 else {
   // что вы тут хотите закрыть одному вам известно
 }
 });

});
Я извиняюсь, это немного не то. Тот скрипт, что я привел, работает на dekstope, его трогать не нужно. Мне просто нужно дописать, что если экран меньше 767 и мы кликаем на ссылку меню, то меню slideToggle();. Я просто не могу понять, какое событие отследить, после которого мне нужно сворачивать меню.

Вот я пытаюсь написать, но пока не то

if ($(window).width() > 767) {
            if($(".main-list").on("click", "a", function(event)){
              $('.page-header-contact').slideToggle();
            })
        }
Ответить с цитированием
  #12 (permalink)  
Старый 07.10.2017, 15:24
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 22,210

breeze125,
что не так?
$(function() {
$(".main-list").on("click","a", function (event) {
 event.preventDefault();
 if($(window).width() > 767){
   var id = $(this).attr('href'),
 top = $(id).offset().top;
 $('body,html').animate({scrollTop: top-50}, 2000);
 }
 else {
   $('.page-header-contact').slideToggle();
 }
 });

});
Ответить с цитированием
  #13 (permalink)  
Старый 12.01.2018, 17:18
Аватар для rikitiki
Интересующийся
Отправить личное сообщение для rikitiki Посмотреть профиль Найти все сообщения от rikitiki
 
Регистрация: 10.05.2013
Сообщений: 20

Здравствуйте!
Не могу найти найти карусель похожую на те что используются на главной странице мобильной версии Яндекса. Там информация сплошь построена на этих каруселях. То-есть происходит подгрузка изображений с помощью lazy load и отстствует подгонка изображений к краям блока при остановке, после окончания действия свапа примерно как по ссылкам:
Example 4
Example 2
Здесь край изображения останавливаются не по краю блока, а произвольно, в сответствии с замедлением.
В Owl Carousel Lazy Load используется, но при остановке край изображения совпадает с краем блока:
https://owlcarousel2.github.io/OwlCa.../lazyLoad.html
Можно ли Owl carousel отключить это выравнивание?

Последний раз редактировалось rikitiki, 12.01.2018 в 17:30.
Ответить с цитированием
  #14 (permalink)  
Старый 12.01.2018, 17:32
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 22,210

rikitiki,
не совсем понятно что вам нужно, может
autoWidth:true,
center: true,
loop:true,
Ответить с цитированием
  #15 (permalink)  
Старый 12.01.2018, 21:20
Аватар для rikitiki
Интересующийся
Отправить личное сообщение для rikitiki Посмотреть профиль Найти все сообщения от rikitiki
 
Регистрация: 10.05.2013
Сообщений: 20

Благодарю за ответ!
Вот скрины c моего смарта в альбомной и портретной ориентации карусели Яндекса после горизонтального свапа по ним:

--------------------------------------------------------------------------------



После остановки карусели какая-либо симметрия группы изображений относительно центра блока отсутствует. После короткого свапа изображение не "отпружинивает" назад, а при более размашистом свапе не перепрыгивает к краю блока. Если очень медленно передвинуть, то то изображение так остаётся под пальцем, создавая иллюзию, что двигаешь некую бумажную ленту с картинками.
В Owl же карусели, даже если не свапить, а тащить мышкой при коротком, медленном перемещении отпружинивает, при более длительном, перескакивает к краю, но не остаётся на месте при отпускании кнопки. Опять таки, край одной из картинок в конце перемещения или прижимется к краю блока, либо, если задано центрирование, одна из картинок обязательно маячит по центру. Других вариантов в карусели нет.
https://owlcarousel2.github.io/OwlCa...os/center.html
Для сравнения приведу опять ссылку TouchCarousel:
http://dimsemenov.com/plugins/touchc...image-and-text
Она похожа на Яндевскую, но в ней нет lazy load. В ней я очень медленно тащу карусель кнопкой мыши , останавливаюсь, отпускаю кнопку мыши и карусель остаётся на месте, где была остановлена и никуда не прыгает.
Собственно такое поведение TouchCarousel обусловлено (из документации) в настройках этим:

$("#yourCarouselId").touchCarousel({
itemsPerMove: 1, // The number of items to move per arrow click.

snapToItems: false, // Snap to items, based on itemsPerMove.

pagingNav: false, // Enable paging nav. Overrides snapToItems.
// Snap to first item of every group, based on itemsPerMove.

Если их поменять то она станет похожа на Owl carousel:
http://dimsemenov.com/plugins/touchcarousel/

Извините, не знаю как здесь прячутся изображения под спойлер. Сейчас пытаюсь это сделать. Тег spoiler не работает.

Последний раз редактировалось rikitiki, 12.01.2018 в 23:20.
Ответить с цитированием
  #16 (permalink)  
Старый 12.01.2018, 23:04
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 22,210

rikitiki,
попробуйте без center,оставьте только autoWidth:true,

https://owlcarousel2.github.io/OwlCa...autowidth.html

больше пока добавить нечего
Ответить с цитированием
  #17 (permalink)  
Старый 12.01.2018, 23:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 22,210

Сообщение от rikitiki
не знаю как здесь прячутся изображение под спойлер
никак
спрятать можно html и js
https://javascript.ru/formatting
Ответить с цитированием
  #18 (permalink)  
Старый 13.01.2018, 02:03
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 1,137

Глянул сейчас в апи второй карусели, там не нашел такой опции отключения прилипания, будет либо центр липнуть либо край айтема.
Может взять карусель из ваших примеров и пользоваться ей?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Owl carousel 2 и старые версии браузеров Quark_ Javascript под браузер 0 11.09.2017 21:10
Баг с owl carousel 2 и history.back(); или обновлением страницы agrovinn Javascript под браузер 0 06.04.2017 21:38
Миниатюры в пагинации Owl Carousel kos0760 jQuery 5 20.05.2016 01:21
Owl carousel 2 не работает с табами - как поправить? ligisayan jQuery 7 08.05.2016 14:41
Почему не правильно считает номера слайдов в карусели owl carousel 2? ligisayan jQuery 13 22.04.2016 11:22