探探/Tinder是一个很火的陌生人社交App,趁着国庆假期闲暇时间倒腾了个Nuxt.js项目,项目中有个模块模仿探探滑动切换界面效果.支持左右拖拽滑动like和no like及滑动回弹效果. 一览效果 emmmm,是不是效果还不错,哈哈~ 好了,下面就简单的讲解下具体的实现过程,大家如果感兴趣的话也可以去试一试. ◆ 整体布局 页面模块布局分为 顶部headerBar.翻牌子区域.底部tabBar 三个部分. 在页面刚加载的时候,为了避免卡片区域空白,加了一张背景图 (古风bg). 布局模板t…

vue-quill-editor是vue很好的富文本编辑器,富文本的功能基本上都支持,样式是黑白色,简洁大方. 第一步下载 vue-quill-editor: npm i vue-quill-editor -S 第二步,将vue-quill-editor引入到main.js: import VueQuillEditor from 'vue-quill-editor' //引入富文本编译器 import 'quill/dist/quill.core.css' import 'quill/dist/…

Android高级控件(六)--自定义ListView高仿一个QQ可拖拽列表的实现 我们做一些好友列表或者商品列表的时候,居多的需求可能就是需要列表拖拽了,而我们选择了ListView,也是因为使用ListView太久远了,导致对他已经有浓厚的感情了,我们之前也是写过几篇关于ListView的博文 Android实训案例(三)--实现时间轴效果的ListView,加入本地存储,实现恋爱日记的效果! Android高级控件(一)--ListView绑定CheckBox实现全选,增加和删除等功能 A…

vue 移动端 PC 兼容 元素 拖拽移动  效果演示 事件知识点 移动端 PC端 注释 touchstart mousedown 鼠标/手指按下事件 touchmove mousemove 鼠标/手指移动事件 touchend mouseup 鼠标松开/手指抬起事件 实现思路 1.鼠标按下时  记录 按下状态  记录x y轴坐标 2.按下移动时 动态计算坐标 设置拖拽元素 style 控制位置 ; 2.1判断拖拽区域 溢出时 归位判断: 2.2拖拽时 阻止页面滑动 3.鼠标抬起  修改 按下状…

之前有写过Vue.Draggable实现拖拽效果(快速使用)(http://www.cnblogs.com/songdongdong/p/6928945.html)最近项目中要用到这个拖拽的效果,当产品那个今日头条app编辑导航,拖拽的效果时,心里暗爽,(之前玩过呀,很简单的,事实证明,任何看似简单的东西,实现起来都不会那么一帆风顺,当然:当你真正实现了该效果时,会发现其实还是挺简单的:ps:自说自话,自己打自己脸\(^o^)/~),闲话少说,直接切入正题: 仔细观察发现,今日头条导航部分编辑效…

https://github.com/kristianmandrup/vue2-dragula git 地址 https://github.com/kristianmandrup/vue2-dragula-demo/ 安装 并在vue里面使用的详细说明 Drag and drop so simple it hurts Vue wrapper for dragula drag'n drop library, based on vue-dragula by @Astray-git. vue 为 dr…

最近开发一个活动需要在手机上给上传的头像加上边框.装饰,需要拖拽.手势缩放边框下的头像图片,因为是vue项目,开始尝试了vue-drag-resize这个组件,对图片拖拽支持很完美,但是无法手势缩放,果断放弃,最后选用了腾讯的AlloyTeam团队的开源的手势库AlloyFinger,闲话少说直接上代码 1.下载 npm install alloyfinger 2.main.js全局配置 import AlloyFinger from 'alloyfinger' import AlloyFing…

一.项目简介 uni-liveShow是一个基于vue+uni-app技术开发的集小视频/IM聊天/直播等功能于一体的微直播项目.界面仿制抖音|火山小视频/陌陌直播,支持编译到多端(H5.小程序.App端) 且兼容效果一致. 二.效果预览 在H5.小程序.App端测试效果如下:(后续大图均为APP端) 三.使用技术 编码器+技术:HBuilderX + vue/NVue/uniapp/vuex iconfont图标:阿里字体图标库 自定义导航栏 + 底部Tabbar 弹窗组件:uniPop(un…

近日欢聚时代公布了2017第四季财报和全年财报,表现不错.其CFO 金秉表示,虎牙最近向美国证券交易委员会(SEC)提交了注册上市申请书草案文件,可能会在美国IPO上市,以便获取自己的投资者群体以融资其长期增长.这意味着虎牙或将成为国内第一个在美上市的游戏直播公司. 早在当年上市时,欢聚时代发布的招股书显示,其主要收入来源为IVAS收入和多玩的广告收入.而当时身为欢聚时代中坚力量的YY语音主要的收入就是来自网络游戏.YY音乐.YY教育及YY VIP的付费用户等.彼时,游戏直播只是YY语音的一个子…

最近一些直播.小视频什么的都比较火,像陌陌.抖音.火山短视频… 于是空闲时间自己也利用html5技术也试着倒腾了下直播项目,使用到了h5+css3+iscroll+zepot+swiper+wlsPop架构开发了一个仿陌陌.火山小视频,项目效果挺不错哒!同时解决了在直播页面聊天时候页面撑起的问题. 效果图如下: // >>>编辑器处理函数 var $chatMsgList = $("#J__chatMsgList"); var $editor = $(".J…