Создание адаптивного сайта с нуля и до результата. ЧАСТЬ 7 и 8. Ценные пул-реквесты.

Автор Pavel Shevchuk
Создание адаптивного сайта с нуля и до результата. ЧАСТЬ 7 и 8. Ценные пул-реквесты.

друзья у нас в проекте появилось 2 новых реквеста и сейчас моих подробно рассмотрим.

Какая сегодня мы находимся в репозитории нашего проекта заходим вот сюда у нас появились нажимаю вот на этот Pull request пользователь решил добавить Smooth Scroll то есть плавный скролл при перемещении pacer lenov.ru. Давайте посмотрим на изменение файла HTML тут добавился it-шник About Me есть — это футляров для футляра соответственно решетка и соответствующее название когда мы кликаем по какой ссылке то перемещаемся на секцию с соответствующим айтишникам. Так, что если наклейка на примерная перемещаемся в секции в атме давно вот к этому месту такое поведение не нужно джаваскрипта — это на поведение браузера главное поставить соответствие между ссылками так и блоками.

Когда будет осуществляться переход.

А я дальше этот пользователь добавил джаваскрипт она изменяет характер перехода из обыкновенного скачка — это превращается в плавное перемещение к нужному блоку также здесь есть очень странные комментарии гласит о том, что вот этот параметр, а точнее аргумент внутри функции может легко контролироваться конечным пользователем есть вами тем самым варьируя скорость перехода сейчас — это 1000 миллисекунд или 1 секунда другой пользователь подтверждает, что — это очень хорошее решение копируем ссылку моего репозитории ural перемещаемся в десктопное приложение следующих частей. Вы можете знаю, что — это доступно git клиент теперь своём оригинальном репозитории. Я добавляю репу пользователя. Сафари — это нужно для того чтобы узнать откуда скачивать пачку изменений. Теперь я могу взять ветку из репозитория ветку. Мастер и смертью со своей. Викой Masters локальная ветка Master всё прошло хорошо. Теперь давайте вернемся в. Редактор кода и посмотрим внедрились ли эти изменения фото обновлённые ссылки HF тоже их хуторе HTML головка расположена поле function JS функция и реализует переход кстати первый раз когда мы пишем реальный Java скрипт код для этого проекта. Я имею забавно, что — это сделал не я, а другой пользователь — это прикольно попробуй объяснить, что здесь происходит и почему — это работает самом верху сокращённый вариант jquery функция с аргументом запускается только в тот момент когда дом-дерево будет полностью готова. Это очень важный момент всё далее. А вот собственно и сама. Функция которую выполняет плавный переход аргумент называется duration продолжительность перехода на. Первом уроке у которых атрибута. Шеф начинается с решетки на выходе мы получаем коллекцию найденных элементов мы вешаем на каждое на каждой обработчик при возникновении события клика на одной из таких ссылок выполняется вот этот кот записывается значение атрибута шрифт у текущей ноты по которому кликнули кто-то в данном случае — это конкретное ссылка. Например у вас есть ссылка. Александрия строчка возьмёт в. Ровно вот эту часть мяу проверяем, что если у. Таргет есть какая-то длина, что — это не пустая строка в этом случае предотвращает стандартное действие которым является переход по гиперссылке то есть момент клика уже не произойдет резкий скачок он как бы отменяется именно за — это функция preventdefault и отвечает если он причём. Обратите внимание, что брал перезагружаться в любом случае не будет потому, что — это переход внутри страницы дальше мы плавно анимируем scrolltop HTML и Body если ссылка такая 204 выглядел вот так пойди. Да всё как идентифицируется этот it-шник, что решётка здесь как раз тоже самое. И написали. Это ссылка на данные H3. Так что. Таргет вот здесь — это как раз и есть тот самый целевой элемент который мы будем переходить NH3 значение 1th. РФ указывает на H3 когда мы кликаем на ссылку в хадере вот здесь на странице ищется элемент данным айтишникам. Всё достаточно проста и логична целевой элемент найден заголовок нашем случае мы должны анимировать свойства scrolltop уводи она указывает на смещение в iport относительно самого верха документа Word. Это область которая в данный момент в браузере, но additional берется из переданного аргумента в нашем случае — это 1000 миллисекунд обновляем и видим работает давай. Теперь попробуем поменять на 300 миллисекунд намного быстрее возвращаюсь на гитхаб и принимаю этот Pull request http request стал частью нашей истории коммитов вот так вы можете видеть, что изменение позиции. Теперь ещё одна штука. Я хочу стянуть изменения уже со своего репозитория потому, что влияние изменений ветка. Сафари я сделал на сайте гитхаба. Мне нужно чтобы этот merge commit оказался у меня локальная копия теперь отслеживать репозитории мне не нужна. Я его удаляю и вот всё актуально. У нас появился ещё один был request парень по имени. Рикардо сделал этот комикс файлов собаки пошагово разберем. Что здесь происходит в том смысле, что он хорошо прокомментировал ся изменение — это очень важно для Pull request которые делаются в открытые проекты типа нашего 1 измененный файл — это config.yml как вы помните вот эти вот переменные добавлял. Я в предыдущих уроках. Хеврон их просто безжалостно снес теперь в конфиге всего лишь три строчки, но он добавил новую папку нижнее подчёркивание дата расположил. Павел портфолио части для удобства и вот эти настройки которые писал. Я теперь они здесь яма.

0 комментариев
0

Читайте также