Как автоматически скрывать панель navbar в Blogger

Я уже писал о том как убрать панель navbar в Blogspot полностью – это легко реализуется с помощью небольших правок в CSS коде шаблона. В принципе, разработчики блоггера не сильно приветствуют это дело, хотя в сети полно примеров шаблонов и работающих проектов, где нет navbar. Подчас он вносит не очень приятное впечатление для определенных Blogger шаблонов — синяя и другие панели уж очень дико смотрится на фоне художественной креативной и большой шапки блога.

Тем не менее, в navbar есть несколько полезных функций – например, поиск по блогу, возможность стать его постоянным читателем или зайти в свою панель управления. Короче говоря, в некоторых случаях она может пригодиться. Но как найти компромисс между функциональностью и красотой? – очень просто.

Для этого понадобится небольшой скрипт или точнее чуть-чуть CSS кода, который позволит автоматически скрывать и показывать панель navbar при наведении на нее мышкой. Итак, заходим в раздел Макет – Изменить HTML. Перед внесением изменений в шаблон сохраним его резервную копию. Далее находим код:

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

Собственно, он используется для скрытия панели navbar – поэтому его нужно заменить на код ниже. Если вы ничего такого в свой шаблон по умолчанию не добавляли, тогда просто вставляем следующие строки:

#navbar-iframe {
opacity:0.0;
height: 10px;
filter:alpha(Opacity=0)
}
#navbar-iframe:hover {
opacity:1.0;
height: 30px;
filter:alpha(Opacity=100, FinishedOpacity=100)
border: 2px;
}

Сохраняем шаблон и проверяем что у нас получилось – должно работать.