Кнопка лайк как на 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$)?>
Чтобы оставить комментарий под этой публикацией, войдите или зарегистрируйтесь.

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

Анимационные плоские смайлики
Анимационные плоские смайлики
Сколько времени тому назад был добавлен материал для сайтов на uCoz
Сколько времени тому назад был доба
CMS login form
CMS login form
10 ресурсов для подбора стильных и бесплатных фото для сайта
10 ресурсов для подбора стильных и
Face Your Manga – сервис для создания аватарок
Face Your Manga – сервис для создан
Новогодние текстуры и паттерны
Новогодние текстуры и паттерны