Плавующие социальные закладки

irbees2008 Опубликовано - 11 - января Кнопки и иконки

Автор: Шамшур Иван
Адаптировал: irbees2008
Уровень сложности исполнения: нужны навыки css hmlt
Демо:

Сегодня хочу вам представить скрипт плавающих соц.закладок для вашего сайта.

1.Скачиваем архив Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.
2.В файле ваших стилей в конец дописываем следующие:

Код:

.soc_buttons {
        position: absolute;
        right: 0;
        top: 152px;
        width: 70px;
    }

    .soc_buttons a {
        display: block;
        position: relative;
    }

3.В main.tpl необходимо разместить непосредственно перед закрывающим тегом

Код:

</head>

Код:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

4.В main.tpl необходимо разместить непосредственно перед закрывающим тегом

Код:

</body>

Код:

<div class="soc_buttons" id="soc_buttons">
<a rel="nofollow" title="Следите за мной на twitter" target="_blank" href="ССЫЛКА_НА_TWITTER"><img src="{tpl_url}/images/new_twitter.png" ></a>
<a rel="nofollow" title="Следите за мной на facebook" target="_blank" href="ССЫЛКА_НА_FACEBOOK"><img src="{tpl_url}/images/fb.png"></a>
<a rel="nofollow" title="Следите за мной по Google+" target="_blank" href="ССЫЛКА_НА_GOOGLE+"><img src="{tpl_url}/images/google.png"></a>
<a rel="nofollow" title="Следите за мной по RSS" target="_blank" href="ССЫЛКА_НА_RSS"><img src="{tpl_url}/images/rss.png"></a>
</div>
<script>
$(function(){
    $('#soc_buttons').socializer();
})
</script>

5.В main.tpl перед

Код:

</head>

подключаем плагин:

Код:

<script src="[tpl_url}/js/jquery.socializer.js"></script>

Можешь почитать и вот эту статейку "Теги dd "

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.