Четверг, 19.06.2025, 18:05

[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Функциональный блок навигации
freakДата: Пятница, 02.10.2009, 10:13 | Сообщение # 1
Лейтенант
Группа: Пользователи
Сообщений: 51
Репутация: 0
Статус: Offline

Срипт представляет собор переключатель,ну на словах трудно объяснить)
Установка:
Куда-нить наверх шаблона ставим это:

Code
<link rel="stylesheet" type="text/css" href="http://iucoz.ru/other/navvvv/navi.css">
<script type="text/javascript" src="http://iucoz.ru/other/navvvv/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="http://iucoz.ru/other/navvvv/jquery.idTabs.min.js"></script>

Всё файлы залиты на iucoz.ru!
Далее в любой свободный блок ставим этот код:

Code
<!-- Блок навигации \ начало -->
<div id="mw_snoopy_colr_2">
<div class="mw_snoopy_banner">
<!-- сам блок -->
<div id="usual2">
<div class="usual">
      <ul>      
      <li><A href="#tabs1" class="selected">Сервисы</A></li>      
      <li><A href="#tabs2">Архив</A></li>      
      <li><A href="#tabs3">Погода</A></li>      

      <li><A href="#tabs4">RSS</A></li>      
      </ul>
      </div>
      <div id="tabs1">
<div id="tabcolumn" class="content">
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/" target="_blank"><img id="fImg2" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/cs.gif" border="0"></a></p>
<br/>
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/" ><img id="fImg6" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/t.gif" border="0"></a></p>
<br/>
<br/>

</div>
<div id="tabcolumn" class="content">
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/" target="_blank"><img id="fImg4" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/l.gif" border="0"></a></p>
<br/>
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/"><img id="fImg5" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/map.gif" border="0"></a></p>
<br/>

      <ul>
      <li><a href="$LOGIN_LINK$">Войти <small></small></a></li>

      </ul>
</div>
<div id="tabcolumn" class="content">
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/" ><img id="fImg7" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/f.gif" border="0"></a></p>
<br/>
      <p style="line-height:100%; margin-top:0; margin-bottom:0;"><a href="/"><img id="fImg8" onMouseOver="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" src="http://iucoz.ru/other/navvvv/c.gif" border="0"></a></p>
<br/>

      <ul>
      <li><a href="$REGISTER_LINK$">Регистрация <small></small></a></li>

      </ul>
           
</div>

      </div>      
           
      <div id="tabs2" class="tabss"><center>$ARCHIVE_MENU$</div> </center>
</div>      
      <div id="tabs3" class="tabss"><center>Код информера погоды</center>
</div>      

      <div id="tabs4" class="tabss"><center><a href="$RSS_LINK$" target="_blank"><img src="http://iucoz.ru/other/navvvv/rss.png" width="128" height="128" border="0"></a>
</center>
</div>      

</DIV>      
           
<SCRIPT type="text/javascript">      
      $("#usual2 ul").idTabs("tabs2");      
</SCRIPT>
<!-- сам баннер -->
</div>

<div id="mw_snoopy_colr_3"></div>

</div>
<div style="clear: both;"> </div>
<!-- навигация \ конец -->

Перейдём к разборке кода!
В блоке сервисы вы можете изменить картинки,а так же ссылку к картинке: a href="/" /-меняем на вашу ссылку! src="http://iucoz.ru/other/navvvv/cs.gif" меняете на вашу картинку!
Блоки Архив и RSS трогать ненадо!Теперь о Погоде!Там лишь стоит "Код информера погоды" Как его получить?Легко!Заходим на сайт http://informer.gismeteo.ru/ и там выбираем любой информер и ставим его код вместо "Код информера погоды"!
Ну всё!Можно радоваться)


freak
 
  • Страница 1 из 1
  • 1
Поиск:


© Все права защищены! 2008-2010 | Сайт оптимизирован под разрешение экрана 1280х1024 и браузеры