jQuery+amaze ui仿电脑端微信网页版聊天界面代码免费下载

jQuery+amaze ui仿电脑端微信网页版聊天界面代码,还有很多功能还没有完善,例如对话快捷键,用户切换,表情包发送等等,算是个半成品吧,感兴趣的朋友可以继续完善。

JS代码

<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript" src="js/amazeui.min.js"></script> 
<script type="text/javascript" src="js/zUI.js"></script> 
<script type="text/javascript" src="js/wechat.js"></script> 
<script type="text/javascript"> 
        //三图标 
        window.onload=function(){ 
            function a(){ 
                var si1 = document.getElementById('si_1'); 
                var si2 = document.getElementById('si_2'); 
                var si3 = document.getElementById('si_3'); 
                si1.onclick=function(){ 
                    si1.style.background="url(images/icon/head_2_1.png) no-repeat" 
                    si2.style.background=""; 
                    si3.style.background=""; 
                }; 
                si2.onclick=function(){ 
                    si2.style.background="url(images/icon/head_3_1.png) no-repeat" 
                    si1.style.background=""; 
                    si3.style.background=""; 
                }; 
                si3.onclick=function(){ 
                    si3.style.background="url(images/icon/head_4_1.png) no-repeat" 
                    si1.style.background=""; 
                    si2.style.background=""; 
                }; 
            }; 
            function b(){ 
                var text = document.getElementById('input_box'); 
                var chat = document.getElementById('chatbox'); 
                var btn = document.getElementById('send'); 
                var talk = document.getElementById('talkbox'); 
                btn.onclick=function(){ 
                    if(text.value ==''){ 
                        alert('不能发送空消息'); 
                    }else{ 
                        chat.innerHTML += '<li class="me"><img src="'+'images/own_head.jpg'+'"><span>'+text.value+'</span></li>'; 
                        text.value = ''; 
                        chat.scrollTop=chat.scrollHeight; 
                        talk.style.background="#fff"; 
                        text.style.background="#fff"; 
                    }; 
                }; 
            }; 
            a(); 
            b(); 
        }; 
</script>
恭喜,此资源为免费资源,请先
本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
打赏
下载价格:免费
下载说明:本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
0

评论0

请先

没有账号? 忘记密码?

社交账号快速登录