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

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

Простые Эффекты при наведении курсора на значок
Простые Эффекты при наведении курсо
Шрифт Badhead
Шрифт Badhead
Необычная графа поиска
Необычная графа поиска
10 ресурсов для подбора стильных и бесплатных фото для сайта
10 ресурсов для подбора стильных и
2000 Flat иконок
2000 Flat иконок
Несколько отличных эффектов при наведении на текст
Несколько отличных эффектов при нав