Небольшая оптимизация блога,скрипт фиксации меню
 

Небольшая оптимизация блога,скрипт фиксации меню

21 Февраль 2014 9:21 Категории: Программирование

Статья о том, как можно оптимизировать код, который я уже описывал в статье о фиксированном меню.

Эта статья предназначена тем, кто уже читал статью Скрипт фиксации меню при прокрутке страницы и на практике освоил данные там примеры.

Так вот, после небольших экспериментов, раздумий, советов друзей, предлагаю вам оптимизировать код фиксации меню. Вместе с вами сейчас будем оптимизировать скрипт фиксации меню на этом самом блоге Catine.

Основная идея этой статьи: Используй сменяемые классы. Меняй лишь один класс, ведь это лучше, чем менять кучу css свойств.

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

Для начала проведем анализ старого кода:

На самом деле вполне логичный код, он работает, но можно сделать его более быстрым, эффективным.

По логике выполнения, у нас есть два состояния шапки: 1)шапка маленькая; 2) шапка большая.
Так что нам мешает создать два класса, которые будут описывать эти оба состояния?
Я создал два класса: .header_min и .header_max, следующего содержания:

Теперь, если задать шапке один из этих классов, то она станет большой, либо маленькой. Таким образом, скрипт фиксации меню при прокручивании страницы мышкой выглядит так:

Такой скрипт выглядит намного изящнее, осталось вынести его в отдельный файл и готово.

Хоть я и люблю свой PHPStorm, но все же советую вам посмотреть еще одно видео Sorax о текстовом редакторе Sublime Text 2:

  • Андрей

    Здравствуйте! Подскажите, пожалуйста, для не особо разбирающихся в допиливании: так как все-таки этот скрипт запитать на сам сайт? Я имею ввиду: где указывать путь до логотипа (у вас в коде его нигде нет) и какими кодами это все запитывается на html страничку сайта? Заранее премного благодарен!