当前位置：首页 > 网页特效 > 图像/媒体

仿Facebook切换表情符号的jQuery插件

分类：图像/媒体日期：2024-05-14 点击(6) 评论(0)

简介

使用该表情符号切换插件需要在页面中引入faceMocion.css和jquery，以及faceMocion.js文件。

```html
<link href="faceMocion.css" rel="stylesheet" type="text/css" />
<script src="jquery.min.js"></script> 
<script src="faceMocion.js"></script>   
```                
#####  HTML结构
可以通过一个input元素来制作表情符号的切换元素。

```html
<input type="hidden" value="amo" class="facemocion"/>
<input type="hidden" value="asombro" class="facemocion"/>  
```                 
#####  初始化插件
在页面DOM元素加载完毕之后，可以通过faceMocion()方法来初始化该jQuery插件。

```html
$(".facemocion").faceMocion();     
```             
#####  配置参数
你可以在初始化插件的时候传入自定义参数，可以在一个容器上调用插件。

```html
$('#example4').faceMocion({
      option: value
});  
```                
Demo (Options)：

```html
{emociones:[
     {"emocion":"amo","TextoEmocion":"I love"},
     {"emocion":"molesto","TextoEmocion":"It bothers me"},
     {"emocion":"asusta","TextoEmocion":"it scares"},
     {"emocion":"divierte","TextoEmocion":"I enjoy"},
     {"emocion":"gusta","TextoEmocion":"I like"},
     {"emocion":"triste","TextoEmocion":"It saddens"},
     {"emocion":"asombro","TextoEmocion":"It amazes me"},
     {"emocion":"alegre","TextoEmocion":"I am glad"}
]}     
```

web299.com

仿Facebook切换表情符号的jQuery插件

简介

html5浪漫粒子表白文字特效

SlidesJS幻灯片特效

html5瀑布流相册特效

css3 svg实现的情人节表白鲜花动画特效

t-scroll.js基于ES6的DOM元素,过渡动画库插件

纯js写省市区三级联动效果