Скриншот
На скриншоте так то не понять смысл скрипта. Реккомендую установить его.
Описание
Не плохо Выполненная навигационная панель для сайтов.
Минус данного скрипта в том, что не каждый сможет понять, куда прописывать свой текст, отображаемый под навигатором. Свой текст нужно прописывать в сам javascript.
Скрипт + html код
Code
<style>
#element1, #element2, #element3 {cursor:pointer;padding: 9px 9px 9px 9px;border: 1px solid #bbbbbb;background:#f1f1f1;width:130px;color:#000000;text-shadow: 0 1px 0 #ffffff;}
#element1:hover, #element2:hover, #element3:hover {background:#f7f7f7;cursor:pointer;}
#slider {border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;border: 1px solid #3e4752;padding: 12px 9px 12px 9px;background:#77818e;width:130px;color:#ffffff;text-shadow: 0 1px 0 #2b333c;}
</style>
<div id="element1" style="position:absolute;margin-left:0px;margin-top:3px;" onclick="selecter(this.id)">Где я?</div>
<div id="element2" style="position:absolute;margin-left:149px;margin-top:3px;" onclick="selecter(this.id)">Регистрация!</div>
<div id="element3" style="position:absolute;margin-left:298px;margin-top:3px;" onclick="selecter(this.id)">О скрипте</div>
<div id="slider" style="z-index:2;position:relative;">Где я?</div>
<div id="content" style="padding-top:5px;width:450px;">
<div><b>Добро пожаловать!</b></div>
<div>Вы зашли на ресурс посвященный языку программирования <b>JavaScript</b></div>
</div>
<script type="text/javascript">
function selecter(id)
{
if (id=="element1")
{
$('#slider').animate({left:'0px'}, 300).html('Где я?');
$('#content').css('opacity','0.0').html(''+
'<div><b>Добро пожаловать!</b></div>'+
'<div>Вы зашли на ресурс посвященный языку программирования <b>JavaScript</b></div>'+
'').animate({opacity:'1.0'}, 300);
}
if (id=="element2")
{
$('#slider').animate({left:'149px'}, 300).html('Регистрация!');
$('#content').css('opacity','0.0').html(''+
'<div><b>Регистрация</b></div>'+
'<div>Зарегестрируйтесь прямо <a href="/index/3">сейчас</a>!</div>'+
'').animate({opacity:'1.0'}, 300);
}
if (id=="element3")
{
$('#slider').animate({left:'298px'}, 300).html('О скрипте');
$('#content').css('opacity','0.0').html(''+
'<div><b>О скрипте</b></div>'+
'<div>Спасибо за установку данного скрипта себе на сайт!</div>'+
'<div>Данный скрипт очень прост в использовании, единственный его недостаток, это то, что текст для вкладок нужно прописывать в самом скрипте. Ну я надеюсь, что Вы сами сможете прекрасно разобраться, куда вставлять нужный Вам текст!</div>'+
'<div style="padding-top:5px;font-size:10px;">Автор: <a href="http://vk.com/garold_orlando" target="_blank"><b>Ваня Ефимов</b></a></div>'+
'').animate({opacity:'1.0'}, 300);
}
}
</script>