Кнопка лайк как на Facebook
Очень стильная кнопка лайков.

Недавно решил переделать скрипт Лайк для Ucoz в стиле Facebook. Убрал ошибки, изменил вид, добавил новые дополнения. Теперь после оценки изменить знак лайка и надпись. Если вы всё-таки решите добавить новые возможности или переделаете его прошу сообщить мне, будет интересно поглядеть =) Кнопка выглядит вот так:



Добавляем этот код туда, где хотим его увидеть:


Код
<?if($RATE_FORM$)?><left><a style="text-decoration: none;" href="javascript://" id="golike" onclick="$.get('/news/0-0-1-$ID$-15-1',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000})};});"><div><span class="pic"><img src="http://manucoz.ru/uploads/posts/2014-12/1419103531_41005429.png" title="Нравится" style="opacity:1;filter:alpha(opacity=100)" onmouseover="this.style.opacity=0.7;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100"></a> </span></div><div class="send"><span class="liker" title="Голосов">$RATED$</span></div><?else?><a style="text-decoration: none;" href="javascript://" id="golike" onclick="$.get('/news/0-0-1-$ID$-15-1',function(data) {if($(data).text().indexOf('уже оценивали')>-1) _uWnd.alert('Вы уже оценивали данный материал!','Ошибка',{w:270,h:60,t:8000}); else {_uWnd.alert('Вы успешно оценили!','Успех',{w:270,h:60,t:8000})};});"><div><span class="pic2"><img src="http://manucoz.ru/uploads/posts/2014-12/1419103564_99335566.png" title="Вам уже понравилось" style="opacity:1;filter:alpha(opacity=100)" onmouseover="this.style.opacity=0.7;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100"></a> </span></div><div class="send2"><span class="liker2" title="Голосов">$RATED$</span></div></left><?endif?>  
<style>  
.liker {float:left; margin:auto; padding-top: 10px; padding-left: 5px;}  
.pic {float:left; margin:auto; position: relative; top: -2; left: 3px;}  

.liker2 {float:left; margin:auto; padding-top: 10px; padding-left: 5px;}  
.pic2 {float:left; margin:auto; position: relative; top: -2; left: 3px;}  
</style>
  

Материал взят с сайта http://manucoz.ru/

Всего комментариев: (0)

_LOGGED_IN$)?>
Чтобы оставить комментарий под этой публикацией, войдите или зарегистрируйтесь.

Случайные материалы

Desygner — бесплатный сервис для создания обложек, макетов, постеров и визиток
Desygner — бесплатный сервис для со
30 бесплатных онлайн редакторов фото-, видео- и аудиофайлов
30 бесплатных онлайн редакторов фот
Смена ника без ПУ.
Смена ника без ПУ.
BumpTop Pro
BumpTop Pro
Toolbar.Js
Toolbar.Js
Знаки отличия пользователей
Знаки отличия пользователей