Предлагаю вашему вниманию информационную панель с выпадающими вкладками для установки ссылок на важные темы вашего сайта. Панель имеет три стиля на выбор под ваш сайт, работает на jquery и не влияет на скорость загрузки страниц.
Установка :
1 . В корне сайта создать папку "themes " и залить картинки из архива.
2 . Заходим в "ПУ" → "Управление дизайном" → "Нужная вам страница" и перед устанавливаем код:
Код
<link type="text/css" href="/css/jx.stylesheet.css" rel="stylesheet"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/js/jquery.jixedbar.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#sample-bar").jixedbar();
});
</script>
3 . Заходим в "ПУ" → "Управление дизайном" → "Нужная вам страница" и перед
устанавливаем код:
Код
<div id="sample-bar">
<ul>
<li title="Home"><a href="ссылка">На главную</a></li>
</ul>
<span class="jx-separator-left"></span>
<ul>
<li title="Социальные сети"><a href="#">Социальные сети</a>
<ul>
<li><a href="http://www.facebook.com/"><img src="/pic/facebook.png" title="Facebook" width="16" />Facebook</a></li>
<li><a href="http://twitter.com/"><img src="/pic/twitter.png" title="Twitter" width="16" />Twitter</a></li>
<li><a href="https://vk.com/uajax"><img src="/pic/vk.png" title="Flickr" width="16" />Группа в контакте</a></li>
<li><a href="http://ok.ru"><img src="/pic/ok.png" title="Одноклассники" width="16" />Одноклассники</a></li>
</ul>
</li>
</ul>
<span class="jx-separator-left"></span>
<span class="jx-separator-left"></span>
<ul>
<li title="Название"><a href="#">Название</a>
<ul>
<li><a href="ссылка"><img src="картинка" title="" width="16" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" width="16" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" width="16" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" width="16" />название ссылки</a></li>
</ul>
</li>
</ul>
<span class="jx-separator-left"></span>
<div>Ваш текст с ссылкой</div>
<ul class="jx-bar-button-right">
<li title="Важно"><a href="#"><img src="картинка" alt="" />Важно</a>
<ul>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
</ul>
</li>
</ul>
<span class="jx-separator-right"></span>
<ul class="jx-bar-button-right">
<li title="инфо"><a href="#"><img src="картинка" alt="" />инфо</a>
<ul>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
</ul>
</li>
</ul>
<span class="jx-separator-right"></span>
<ul class="jx-bar-button-right">
<li title="еще инфо"><a href="#"><img src="картинка" alt="" />еще инфо</a>
<ul>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
<li><a href="ссылка"><img src="картинка" title="" />название ссылки</a></li>
</ul>
</li>
</ul>
<span class="jx-separator-right"></span>
</div>
:
плавающая , UCOZ , script , Scripts , инфопанель , скрипт
×
Комментариев пока нет..
Ты можешь быть первым, кто оставит комментарий к публикации!