Главная » Файлы » Прочие скрипты » jQuery

Перевод обычных смайлов в графический вид через плагин css imoticons на CSS и jQuery
23.06.14, 09:31:59

Скачать файл




Данный плагин позволяет переводить любые ваши смайлы, которые вы вводите с клавиатуры (К примеру, ":)" ":-)" ":(" ":-(" ) в графический вид, причём, при наведении на получившийся смайл, он плавно изменится на первоначальный печатный вид, показав вам, из каких символов состоит

Для начала посмотрите ДЕМО

Установка:

После /head на нужных страницах вставляйте:
Код
<link href="/css/jquery.cssemoticons.css" media="screen" rel="stylesheet" type="text/css" />
  <script src="/js/jquery.cssemoticons.min.js" type="text/javascript"></script>
  <script type="text/javascript">
$(document).ready(function(){  
$('.text').emoticonize({  
//delay: 800,  
//animate: false  
//exclude: 'pre, code, .no-emoticons' // < = this is the default  
});  
  $('#toggle-headline').toggle(  
function(){  
$('#large').unemoticonize({  
//delay: 800,  
//animate: false  
})  
},
function(){  
$('#large').emoticonize({  
//delay: 800,  
//animate: false  
})  
}  
);  
})  
  </script>

  <style type="text/css">
#small { font-size: 8px; }  
#large { font-size: 72px; }  
#regular { font-size: 20px; }  
.wrapped { width: 350px; }  
  </style>


Далее оформляйте участок, где печатные смайлы должны переводиться в графические, следующим образом:
Код
<p class="text" id="regular">
  Здесь будет любой ваш контент, в котором печатные смайлы заменяются графическими. Вот пример некоторых смайлов:  
:o) :c) :^) :-D :-( :-9 ;-) :-P :-p :-Þ :-b :-O :-/ :-X :-# <img src="http://s101.ucoz.net/sm/23/cry.gif" border="0" align="absmiddle" alt="cry" /> B-) 8-) :-\ ;*( :-*  
  </p>


Осталось лишь залить скрипт из прикреплённого архива в папку js и стиль в папку css

Материал подготовлен Apocalypse
Категория: jQuery | Добавил: Apocalypse | Теги: CSS, обычных, Через, вид, на, плагин, imoticons, Графический, смайлов, перевод
Просмотров: 441 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: