• Страница 1 из 1
  • 1
Функциональный блок навигации

серегаДата: Суббота, 19.06.2010, 14:45:19 | Сообщение # 1
Генералиссимус
Сообщений: 1544
Награды: 1
Репутация: 2
Итак!Я снова с вами!Сегодня я предоставлю мою разработку блока навигации для iucoz.ru!Админ решил выложить в паблик,поэтому встречаем:

Срипт представляет собор переключатель,ну на словах трудно объяснить)
Установка:
Куда-нить наверх шаблона ставим это:
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/ и там выбираем любой информер и ставим его код вместо "Код информера погоды"!
Ну всё!Можно радоваться)Этого решения в корне небыло на uCoz и я как автор разрешу изменять код,но на других сайтах если увижу,то только с сылкой на iucoz.ru и указанием автора StiFix!!!
На этом всё!Незабываем комментровать и поднимать репутацию!



Делаю сервера и настраиваю их: WoW CS Mu online не дорого isq 499846784

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