Кнопка мне нравится на сайты в HTML + CSS

Если вы считаете, что ваш материал можно оценивать, то для этого нужен скрип кнопки, что как раз здесь представлен для конструктора uCoz системы. И по сути нам нужно сделать так, чтоб пользователь изначально видел данную кнопку, а значит сделать ее более яркой. Что для темного формате, и аналогично для светлого формата, данный оттенок цвета отлично впишется под любую тематику.

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

Так кнопка выглядит по дизайну:

Установка:

По месту где хотите наблюдать данную кнопку оценивать.

HTML

Код:

  <?if($RATING$)?>  
  <div id="rating_os">  
  <a href="jаvascript://" id="golike" onclick="$.post('/load',{'a':65, 'mark':1, 'mod':'load', 'ajax':2, 'id':'$ID$', '_tp_':'xml'},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 id="rating_l">Mне нравится</div>  
  </a>  
  <div id="rating_p">+$RATED$</div>  
  </div>  
  <?endif?>

CSS

Код:

  #rating_os {  
  float:right;  
  font: 11px Verdana,Arial,Helvetica, sans-serif;  
  text-shadow: 1px 1px 1px #fff;  
  background:#dfecf4;  
  border: 1px solid #ADD6EF;  
  }  

  #rating_os a:link,  
  #rating_os a:visited,  
  #rating_os a:hover {text-decoration:none; color:#2C68A6;}  

  #rating_l {  
  float:left;  
  background: url(http://ltmusic.ru/like/ugol_blue.png) no-repeat right;  
  padding: 3px 10px 3px 5px;  
  }  

  #rating_l:hover {  
  background: #ADD6EF url(http://ltmusic.ru/like/ugol_blue.png) no-repeat right;  
  }  

  #rating_p {  
  float:right;  
  color:#235e9b;  
  padding: 3px 5px 3px 5px;  
  background:#b5d9ee;  
  }