переходить с горизонтальной прокрутки на вертикальную

0

Мой сайт является отзывчивым. При посещении с ноутбука он имеет горизонтальную навигацию, но при посещении с мобильного я хотел бы изменить ту же анимацию прокрутки, но по вертикали...

 <script>

$(function() {
    $('.nav a').bind('click',function(event){
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollLeft: $($anchor.attr('href')).offset().left
        }, 500);
        event.preventDefault();
    });
});


</script>

Веб-сайт www.niklaskoskela.com

Дайте мне знать, если мне нужно предоставить что-нибудь еще.

С уважением

Теги:
horizontal-scrolling
vertical-scrolling

1 ответ

0

Модифицируйте ваши.js следующим образом:

$(function() {
    $('.nav a').bind('click',function(event){
        var anchorOffset = $(this.hash).offset();
        $('html, body').stop().animate({
            scrollLeft: anchorOffset.left,
            scrollTop: anchorOffset.top // <- add this line
        }, 500);
        event.preventDefault();
    });
});


</script>

и в.css добавить медиа-запросы:

@media all and (max-width: 1024px){
  #one, #two, #three {
    float: none;
  }
}
  • 0
    Я не мог сделать эту работу. Функция прокрутки не работает ни на одном из них ... Я что-то упустил? У меня есть медиа-запрос для экрана @media и (max-device-width: 960px Это противоречит этому?
  • 0
    Извините, я допустил опечатку. Должно быть .hash вместо .href Пожалуйста, проверьте рабочий образец . Обратите внимание, что я использовал display:inline-block а не float:left . Если есть вопросы, задавайте. Что касается второй части вашего вопроса: я не заметил ваши медиа-запросы. Это не проблема. Вы можете перемещать float: none к вашему. Это не важно
Показать ещё 5 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню