На нашем сайте мы используем cookie для сбора информации технического характера и обрабатываем IP-адрес вашего местоположения. Продолжая использовать этот сайт, вы даете согласие на использование файлов cookies. Здесь вы можете узнать, как мы пользуемся файлами cookies.
Я согласен
логотип upread.ru

Прилипающая шапка на сайт парой строчек


Иногда для решения проблемы на сайте, буквально можно написать пару строчек. И все, необходимое будет достигнуто – без расширений, дополнений. Например, вот на сайте на вордпрес заказчику понадобилось иметь шапку, которая при прокрутке бы прилипала к верху страницы.

Первое, что приходит в голову наверно любому разработчику под WordPress – это использовать плагин. И я уверен, что можно найти такой плагин. Наверняка можно будет ввести в этот плагин идентификатор шапки (или еще как-то её обозначить) и после изменения настроек и запуска – все заработает.

Однако, каждый новый плагин – это увеличенная настройка на сервер. Может быть, совсем немного, но все же каждый раз будет задействована какая-то часть ресурсов. Кроме этого, плагин надо найти и настроить – а нередко они на английском. Проверять обновления, поддерживать актуальность – нередко через устаревшие плагины происходит взлом сайта.

Отлично, но как же решить нашу задачу без плагина? Очень просто: в любое место добавляем виджет HTML-код. Можно, например, в самый низ в подвал. Но вообще, главное – после шапки и подключения jQuery. Код у нас будет такой:

window.addEventListener('scroll', function() {
if (window.scrollY > 200) {
jQuery("#masthead").css('position','fixed');
jQuery("#masthead").css('width','100%');
jQuery("#masthead").css('top','0');
}
else {
jQuery("#masthead").css('position','relative');
}		
});
У вас параметры могут быть другими. Во-первых, надо узнать «приклеиваемый» к верху элемент. В нашем случае это шапка с ид – masthead – у вас может быть другой. Также параметр 200 может быть и не таким. Можно добавить плавность прилипания к верху страницы и прочее – это все тоже несложно делается.



Обращу ваше внимание, что я не призываю полностью отказаться от готовых плагинов – в некоторых случаях они просто незаменимы. И почти всегда – очень удобны. Просто не так уж редко можно плагин заменить вот такой вот парой строчек, а результат будет не хуже. Пишите – любая помощь по WP и не только. Недорого и быстро.



Автор этого материала - я - Пахолков Юрий. Я оказываю услуги по написанию программ на языках Java, C++, C# (а также консультирую по ним) и созданию сайтов. Работаю с сайтами на CMS OpenCart, WordPress, ModX и самописными. Кроме этого, работаю напрямую с JavaScript, PHP, CSS, HTML - то есть могу доработать ваш сайт или помочь с веб-программированием. Пишите сюда.



тегизаметки, javascript, WordPress

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




Отправка сообщения в телеграм на Java
Двоичные числа и двоичная математика


© upread.ru 2013-2020
При перепечатке активная ссылка на сайт обязательна.
Задать вопрос
письмо
Здравствуйте! Вы можете задать мне любой вопрос. Если не получается отправить сообщение через эту форму, то пишите на почу up777up@yandex.ru
Отправляя сообщение я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта.