开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >专栏 >h5群聊天室|h5仿微信聊天室|h5直播聊天

h5群聊天室|h5仿微信聊天室|h5直播聊天

原创

作者头像

andy2018

修改于 2018-08-05 08:28:15

修改于 2018-08-05 08:28:15

6.4K1

举报

文章被收录于专栏：h5h5

今年的FIFA世界杯甚是精彩，最近兴致高涨就利用HTML5开发了一个手机端仿微信界面聊天室，该h5聊天室采用750px全新伸缩flex布局，以及使用rem响应式配合fontsize.js，页面弹窗则是使用自己开发的wcPop.js插件；编辑器部分由原先的单一表情新增为动图表情，实现了消息、表情发送 | 大图、视频效果预览 | 仿微信红包、打赏等微交互功能。

——>>>欢迎一起交流学习 QQ：282310962 微信：xy190310

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

如有侵权，请联系 cloudcommunity@tencent.com 删除。

评论

登录后参与评论

1 条评论

热度

最新

andy2018回复andy2018

2018-11-18

https://www.cnblogs.com/xiaoyan2017/

https://www.cnblogs.com/xiaoyan2017/

回复回复点赞举报

编辑精选文章

换一批

万字详解高可用架构设计

Go 开发者必备：Protocol Buffers 入门指南

10分钟带你彻底搞懂分布式链路跟踪

多租户的 4 种常用方案

亿级月活的社交 APP，陌陌如何做到 3 分钟定位故障？

60页PPT全解：DeepSeek系列论文技术要点整理

h5仿微信聊天项目案例源码(单聊、多聊)|仿微信界面

微信 android ios

最近由于项目需求，利用h5+css3+zepto+wcPop等技术开发了一个仿微信聊天项目(仿微信聊天界面)，可以实现发送消息、表情，预览图片、视频，红包打赏、霸屏等操作，聊天界面采用了flex弹性布局，弹窗则采用自己开发的wcPop.js插件(内置多种弹窗效果android、ios)，整体界面精美，运行流畅。

xiaoyan2018

2018/05/09

12.8K2

h5仿微信聊天项目案例源码(单聊、多聊)|仿微信界面

h5即时聊天|在线聊天客服|h5在线咨询

鉴于之前有开发过h5仿微信聊天，最近又捣鼓了一个h5在线咨询项目，可实现顾客在线一对一聊天沟通，发送消息、表情(动图)，发送图片，推送商品链接。

andy2018

2018/07/27

6.5K0

h5即时聊天|在线聊天客服|h5在线咨询

h5高仿微信web网页版|仿微信聊天项目

html5 jquery api

https://blog.csdn.net/xiaoyan_2015/article/details/81750894

andy2018

2018/08/18

4.4K0

h5高仿微信web网页版|仿微信聊天项目

react仿微信即时IM聊天|react+redux仿微信界面

react 微信 redux

基于react+react-dom+react-router-dom+redux+react-redux+ant等技术开发的手机端仿微信界面聊天，实现了聊天记录下拉刷新、发送消息、表情(动图)，图片、视频预览，打赏、红包等功能。

andy2018

2019/06/21

5.5K1

react仿微信即时IM聊天|react+redux仿微信界面

[高仿版]h5实战仿微信聊天项目

最近也是由于项目需要做一个类似微信聊天功能，需要用html5去实现，如是就开始捣鼓开发了一个h5高仿微信聊天功能，和微信功能，样式非常相似，整体采用flex布局，使用自己开发的wcPop弹窗插件。

andy2018

2018/05/11

3.1K3

[高仿版]h5实战仿微信聊天项目

支付宝小程序弹窗插件开发|仿微信/android/ios弹窗效果

微信小程序

支付宝小程序弹窗交互组件和微信小程序弹窗功能都差不多，对功能有比较多的限制，尤其想要实现丰富一些的弹窗场景就只能自己写组件实现了。

andy2018

2018/12/02

3.2K0

支付宝小程序弹窗插件开发|仿微信/android/ios弹窗效果

h5仿微信web端|仿wechat网页聊天实战

微信 html5 jquery

《H5+CSS3微信h5微场景实战开发》仿微信H5电脑端聊天场景项目案例、h5仿微信聊天界面

andy2018

2018/06/14

4.3K0

h5仿微信web端|仿wechat网页聊天实战

vue.js聊天IM系统|聊天室|群聊

微信 webpack vue.js javascript 打包

基于vue+vuex+vue-router+webpack2.0+es6+wcPop+iconfont等技术开发的仿微信界面聊天室，之前使用h5开发过一版h5聊天室，实现了微信聊天功能、发送消息/表情，图片、视频预览，打赏、红包等功能。

andy2018

2019/04/05

13.1K2

vue.js聊天IM系统|聊天室|群聊

小程序聊天室|聊天对话小程序|仿微信界面

小程序微信

基于微信小程序开发的聊天室实战案例。很早之前就有开发过一个h5版聊天室，最近又开发了个小程序版聊天室，功能效果非常接近微信聊天，实现了消息、表情发送，小程序表情解析，图片、视频上传预览，打赏、红包等功能。

andy2018

2019/01/30

14.7K3

小程序聊天室|聊天对话小程序|仿微信界面

angular聊天IM实例|仿微信angular版|NG2案例

angularjs 微信

运用angular+@angular/cli+@angular/router+@ngrx/store等技术实现开发的移动端聊天室angular版，实现了下拉刷新、长按右键菜单、发送消息、表情(动图)，图片、视频预览，打赏、红包等功能。

andy2018

2019/07/16

3.9K0

angular聊天IM实例|仿微信angular版|NG2案例

h5移动端智慧办公项目案例

h5开发的微信端智慧办公——weDingTalk项目，运用到了html5+css3+jquery+swiper+wcPop等技术进行开发，其中wcPop.js弹窗插件又进行了一次全面升级(新增全屏弹窗)，另外项目中多处应用到了Material Design波纹效果，很多地方的1px进行了细化处理。 001360截图20180915003708059.png 002360截图20180915003826602.png 003360截图20180915005347716.png 004360截图20180915

andy2018

2018/09/17

2K1

vue+web端聊天室|网页端vue聊天系统

使用了Vue2.5.6+Vuex+vue-router+vue-gemini-scrollbar+swiper+elementUI等技术开发，实现了发送消息、表情(动图)，图片、视频预览，仿微信右键菜单、截图可直接粘贴至编辑框发送。

andy2018

2019/05/01

12K1

vue+web端聊天室|网页端vue聊天系统

react实战开发|react+web版聊天室

react redux webpack javascript 打包

基于react+react-dom+react-router-dom+redux+react-redux+webpack2.0+react-photoswipe+swiper等技术混合开发的web版聊天室reactWebChat项目，实现了发送消息、表情(动图)，图片、视频预览等功能。

andy2018

2019/06/29

2.8K0

react实战开发|react+web版聊天室

支付宝小程序wcPop弹窗自定义插件dialog模板

最近由于项目需要，自己开发的支付宝小程序自定义弹窗插件wcPop，就抽空整理了一份demo，多种api调用，插件语法简洁优雅，可随意修改各种弹窗效果。

andy2018

2018/11/30

2K1

支付宝小程序wcPop弹窗自定义插件dialog模板

h5仿微信、支付宝键盘wcKeyboard插件

利用html5开发的仿微信支付数字键盘，密码软键盘插件wcKeyboard，可自定义背景、类型、皮肤，包含微信、支付宝两种皮肤样式，可初始化多个键盘。

andy2018

2018/12/08

2.7K0

h5仿微信、支付宝键盘wcKeyboard插件

uni-app自定义弹窗模板uniPop组件

uni-app自定义弹窗uniPop.vue模板|uniapp仿微信弹窗/仿ios弹窗效果|msg信息框|alert对话框|loading提示框

andy2018

2019/09/28

24.1K9

uni-app自定义弹窗模板uniPop组件

Flutter+Dart聊天实例|flutter仿微信聊天|红包|朋友圈

flutter ios android

Flutter_Chatroom聊天室项目是基于flutter+dart技术开发的跨平台聊天实战案例，基本实现了登录/注册表单验证、消息表情发送、图片预览、红包/视频/朋友圈等功能。

andy2018

2020/05/13

7K1

Flutter+Dart聊天实例|flutter仿微信聊天|红包|朋友圈

Vue3.x+Vant3仿微信聊天|朋友圈

2021已来临，Vue3开发也要步入正轨了。今天为大家带来的是全新开发的Vue3.x实战聊天室项目Vue3_Chatroom，基于vue3+vant3+vuex+vue-router+v3popup等技术搭建的聊天实例。

andy2018

2021/01/09

4.4K2

Vue3.x+Vant3仿微信聊天|朋友圈

uni-app+vue仿微信聊天APP界面|uniapp仿微信朋友圈

微信小程序 vue.js html5

基于uniapp+vue仿微信聊天室uniapp-chatroom项目，vue语法及类似小程序api开发原生APP应用，实现了发送图文消息、表情(gif动图)，图片预览、地图位置、红包、仿微信朋友圈等功能。

andy2018

2019/10/10

10.7K3

uni-app+vue仿微信聊天APP界面|uniapp仿微信朋友圈

微信小程序自定义模态弹窗(wcPop)|多种弹窗样式

小程序微信

在平时微信小程序开发中，弹窗应用场景还是蛮广泛的，如果你刚好项目开发中用到的话，希望对你有用~

andy2018

2018/11/18

13.5K3

微信小程序自定义模态弹窗(wcPop)|多种弹窗样式

相关推荐

h5仿微信聊天项目案例源码(单聊、多聊)|仿微信界面

更多 >

LV.1

这个人很懒，什么都没有留下～

作者相关精选

换一批

交个朋友

加入前端学习入门群

前端基础系统教学经验分享避坑指南

加入前端工作实战群

前端工程化实践组件库开发经验分享

加入前端趋势交流群

追踪前端新趋势交流学习心得

换一批

加入讨论

的问答专区 >

我是基里安墨菲0

相关课程

一站式学习中心 >

腾讯云向量数据库-RAG七天入门训练营

向量数据库

腾讯云安灯

微信公众号在线学习平台搭建实践_《硅谷课堂》

低代码实战营

微搭低代码