http://trifler.ru/blog/ Lasto Blogging Engine ru gordi serg_gordi@mail.ru serg_gordi@mail.ru http://trifler.ru/blog/i/lastoblog.png http://trifler.ru/blog/ http://trifler.ru/blog/post_1222107042.html <p>Сразу оговорюсь.</p> <p>С одной стороны подобного рода меню с точки зрения SEO не пользуются респектом у поисковиков. Возможно, кому-то это покажется не важным, но, тем не менее, для тех, кто занимается продвижением и более того затачивает свои ресурсы с единственной, но весьма благородной целью так или иначе заработать на хлеб с маслом, а может и не только, стоит обратить на это самое пристальное внимание.</p> <p>С другой стороны, придание динамики интерфейсу <span>web</span>-страницы имеет и свои положительные моменты. Но вот, на сколько удобны данные меню не для вас (мало ли, что нравиться лично вам), а для пользователя, решать придется самостоятельно с оглядкой именно на него.</p> <p>Как вы понимаете, проблем, а мы говорим о самых простых меню созданных с использованием псевдокласса <span>:hover</span>, нет, за исключением IE6. Все не однократно описывалось в различных источниках, да и сам <a href="http://trifler.ru/blog/comment_1182801700.html">грешен</a> :)</p> <p>Чтобы привести в чувство любимый браузер, как не крути, а без скрипта не обойтись. Но не будем изобретать велосипед. Шести строк кода для этих целей, вполне достаточно, что полностью соответствует представлениям автора о правилах написания не только <span>html</span>-кода и стилей, где лаконичность и компактность оного ставится, чуть ли не на первое место.</p> <p>Яркое тому подтверждение пост <a href="http://trifler.ru/blog/post_1208183758.html">"Комплект шаблонов"</a>, где в таблице стилей состоящей чуть более, чем из двадцать строчек, присутствуют самые необходимые вещи - начиная от разметки на четыре шаблона, до решения проблемы иллюзии одинаковой высоты колонок, совместно с эмуляцией <span>min/max width</span> для IE6, без так надоевшего <span>expression</span> :)</p> <p>Скрипт в не котором смысле универсален, заточен конкретно под IE6 и останавливаться на нем более подробно нет никаких причин. Тем более, что его без всяких изменений можно использовать и в горизонтальном и в вертикальном меню.</p> <p>Скрипт <span>menu.htc</span></p> <pre class=pre> &lt;attach for=element event=onmouseover handler=topm&gt; &lt;attach for=element event=onmouseout handler=verm&gt; &lt;script&gt; function topm(){element.className='navigation';} function verm(){element.className='';} &lt;/script&gt;</pre> <p>Во всех случаях должен находиться в папке <span>css</span>, рядом с основным файлом стилей, в котором и обитают стилевые правила для меню.</p> <p><span>html</span>-код особенностей не имеет. Обычный список с необходимой степенью вложений.</p> <p>Стили, описывающие поведение меню, частично оптимизированы, но в них легко разобраться, и есть возможность все настроить в соответствии со своими вкусами и предпочтениями.</p> <p>Горизонтальное меню, располагается по центру страницы. Методика, как это сделать, довольно подробно освещена <a href="http://trifler.ru/blog/post_1212599291.html">здесь</a>.</p> <p><a href="menus.html">Смотрим</a></p> <p>С рабочим вариантом горизонтального меню в боевых условиях для <i>nano-CMS</i> от <i>Мастера Lasto</i>, можно ознакомится по этому <a href="http://trifler.ru">линку</a>.</p> <p>О конкретной интеграции в скрипты Вадима, как то - <i>блог</i>, <i>портатор</i>, та же <i>nano-CMS</i>, поговорим чуть позже в одной из следующих публикаций.</p><!-- RSS_link_to_post start --> <br> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1222107042.html">Оставить комментарий</a></div> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1222107042.html">All Comments</a></div> <!-- RSS_link_to_post end --><!-- RSS_link_to_post start --> <br> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1222107042.html">Оставить комментарий</a></div> <div style="margin-left:10px;color:#575;font-weight:bold;"><a href="http://trifler.ru/blog/post_1222107042.html">All Comments</a></div> <!-- RSS_link_to_post end --> Tue, 23 Sep 2008 01:10:42 GMT