diff --git a/static/css/common.css b/static/css/common.css
index 34d8787..34cdba4 100644
--- a/static/css/common.css
+++ b/static/css/common.css
@@ -46,6 +46,7 @@
     bottom: 0px;
     z-index: 999;
 }
+
 .faceBox{
     width: 100%;
     background: #fff;
@@ -311,7 +312,10 @@ a{color: #07a9fe;text-decoration: none;}
     background: #fff;
     border-top: 1px solid #e5e5e5;
 }
-
+.kefuFuncBox .faceBox{
+    position: absolute;
+    bottom:100px;
+}
 .kefuFolderBtn{vertical-align: middle;}
 .visitorReply{
     font-size: 14px;
diff --git a/static/js/chat-main.js b/static/js/chat-main.js
index 21da004..982aeac 100644
--- a/static/js/chat-main.js
+++ b/static/js/chat-main.js
@@ -55,6 +55,7 @@ var app=new Vue({
         replyTitle:"",
         ipBlacks:[],
         sendDisabled:false,
+        showFaceIcon:false,
     },
     methods: {
         //跳转
@@ -542,15 +543,7 @@ var app=new Vue({
                     $.each(faceTitles, function (index, item) {
                         _this.face.push({"name":item,"path":faces[item]});
                     });
-                    $(".faceBtn").click(function(){
-                        var status=$('.faceBox').css("display");
-                        if(status=="block"){
-                            $('.faceBox').hide();
-                        }else{
-                            $('.faceBox').show();
-                        }
-                        return false;
-                    });
+
                 });
             });
             var _hmt = _hmt || [];
@@ -563,7 +556,7 @@ var app=new Vue({
         },
         //表情点击事件
         faceIconClick(index){
-            $('.faceBox').hide();
+            this.showFaceIcon=false;
             this.messageContent+="face"+this.face[index].name;
         },
         //上传图片
diff --git a/static/templates/chat_main.html b/static/templates/chat_main.html
index 5aef9f9..519bd9a 100644
--- a/static/templates/chat_main.html
+++ b/static/templates/chat_main.html
@@ -8,7 +8,7 @@
     <script src="https://cdn.staticfile.org/vue/2.6.9/vue.min.js"></script>
     <script src="https://cdn.staticfile.org/element-ui/2.15.1/index.js"></script>
     <script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>
-    <link rel="stylesheet" href="/static/css/common.css?v=0.3.8">
+    <link rel="stylesheet" href="/static/css/common.css?v=dgftr65ujhfg">
     <script src="/assets/js/functions.js"></script>
     <script src="/assets/js/reconnecting-websocket.min.js"></script>
     <style>
@@ -107,14 +107,14 @@
                         <div class="kefuFuncBox">
                             <div class="iconBtnsBox">
 
-                                <div class="faceBox kefuFaceBox">
+                                <div class="faceBox kefuFaceBox" v-show="showFaceIcon">
                                     <ul class="faceBoxList">
                                         <li v-on:click="faceIconClick(i)" class="faceIcon" v-for="(v,i) in face"  :title="v.name"><img :src=v.path></li>
                                     </ul>
                                     <div class="clear"></div>
                                 </div>
                                 <el-tooltip content="发送表情" placement="top">
-                                    <div class="iconBtn faceBtn el-icon-s-shop" style="font-size: 24px;"></div>
+                                    <div class="iconBtn faceBtn el-icon-s-shop" style="font-size: 24px;" @click.stop="showFaceIcon==true?showFaceIcon=false:showFaceIcon=true"></div>
                                 </el-tooltip>
 
                                 <el-tooltip content="上传图片" placement="top">