1. HTML5 拖拽 1.1 相关知识 拖拽元素：可以为元素添加 draggable=true 来让元素能够被拖拽。 拖拽元素的事件监听：（应用于拖拽元素） ondragstart 当拖拽开始时调用 ondragleave 当鼠标离开拖拽...

本文实例为大家分享了JavaScript实现京东秒杀效果的具体代码，供大家参考，具体内容如下 首先先利用html和css搭出架子： * { margin: 0; padding: 0; } .box { width: 190px; height: 270px; color: #fff; te...

效果 一个大小的两个面，在同一位置上 正面的Y轴旋转为0度 背面的Y轴旋转180度 隐藏被旋转的 div 元素的背面（backface-visibility） 点击的时候同时改变正面和背面的旋转角度，给一个动...

本文实例为大家分享了JavaScript实现滑块验证码的具体代码，供大家参考，具体内容如下 效果： 鼠标在底部滑块上按下按住不松拖动可以移动滑块，上面大图里面带有小图背景的滑块也...

一、新的文档类型声明(DTD) 文档类型声明 HTML 5的DTD声明为: !doctype html !DOCTYPE html 等也是正确的，因为HTML语法是不区分大小写的。 在编写HTML5文【自由互联：韩国服务器 转载请保留连接...

本文实例为大家分享了JavaScript自定义日历效果的具体代码，供大家参考，具体内容如下 实现思路： 获取每个月的第一天是星期几，然后把前面的天数填充为空，在获取每个月有多少天...

项目地址： https://github.com/xiaosu95/canvas_mobile_drag 点击查看demo（在移动端上查看） 该插件是一款脱离jq的移动端图片编辑器。可以应用在移动端H5页面或者微信小程序中。 插件实现的功能...

1、访问字面量和局部变量最快，而访问数组元素和对象成员相对较慢。访问对象成员时，就像作用域链一样，在原型链上搜索。 2、如果找到的成员在原型链中的位置太深，访问速度就...

随着移动端的流行，在移动端对网站进行重构和开发势在必行。但是你只有了解了移动设备的meta viewport参数之后，才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。 v...

前端上传图片的原理是：运用input type=“file”的标签获取图片，再使用FileReader这个对象 new 一个实例，通过这个对象的readAsDataURL()方法读取file标签获取的图片并转换为base64格式，完成之...

一、需要实现的功能： 用H5实现的App中需要在H5获取手机中的照片或者视频文件上传到服务器。 二、分析实现方法： 由于不懂前端开发，不知道H5中有 input file之类的标签控件，可以用...

本文实例为大家分享了js实现自定义下拉框的具体代码，供大家参考，具体内容如下 实现思路： (1)创建一个列表和一个span之类的标签（那个标签都可以）， (2)列表的每一项分别绑定点...

本文由葡萄城技术团队原创并首发 作者：葡萄城官网，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。 HTML5的发展改变了互联网技术趋势，前端热度依旧不减，所...

（一）方法一：直接在script标签中提前定义，仅适用于该html文件！ let add = function(a,b){ return a + b; }; console.log(add(20,300)); const { ['log']:C } = console; C(add(20,300)); （二）方法二：按tab键快速生...

本文由葡萄城技术团队原创并首发 上一篇我们已经为大家介绍了HTML5新增的内容和基础页面布局，这篇会继续向大家介绍广义上HTML5中另一个组成部分：JavaScript数据类型。 JavaScript作为...

浮动广告是目前网站很常见的一种广告形式，浮动广告能实时跟随用户的浏览，有效的传达产品要表达的意思，达到很好的传播效果。那么浮动广告是怎么实现的呢，其实实现浮动广告...

首先说一下左侧菜单栏 这是一个最基本的左侧菜单栏，实现的过程很简单，官方的说明文档就有，但是我在导入layer.js之后，直接复制这段官方代码到我的编辑器上时，发现页面是这样...

用了layui框架 1.home.html主界面： !DOCTYPE htmlhtml head meta charset=UTF-8 title首页/title script src=../js/jquery.js/script link rel=stylesheet href=../layui/css/layui.css /head body class=layui-layout-body div class=layui-layou...

记录下一个疑问，最近在重新看canvas做点Demo这样，时间是写在2019年11月5日，以后要是没有这个问题了，以W3C更新的为标准，这个只是参考 尝试着在canvas中显示视频第一帧的时候碰上的...

公司项目需求，要实现任务卡片在不同任务列表之间进行拖拽实现任务类别的更改。于是找了一下相关文章，稍微学习了一下。实现效果如下图。 拖拽实现 主要用到的是H5自带的拖拽效...

Android平台提前注入5+ API，支持在plusready事件前调用 在5+ Runtime环境中，通常情况下需要html页面解析完成后才会注入5+ API，执行的顺序为： 1. 加载html页面 2. 解析html页面（下载script/lin...

最近做项目，遇到一个问题，在手机上要实现视频的全屏播放功能。测试了很久，终于找到解决办法。 第一种：将视频放大来控制。 视频在播放的时候，全屏是根据高度来的，如果设...

本文主要记录 canvas 在图像、文字处理、离屏技术和放大镜特效的实现过程中使用到的API。先看下效果吧： 一张模糊的图片： 鼠标点击任意位置，产生放大效果： 哇塞~ 一个帅哥，哈哈...

【一、前言】 HTML5 特性，包括原生音频和视频支持而无需 Flash。 HTML5 audio 和 video 标签让我们给站点添加媒体变得简单。我们只需要设置 src 属性来识别媒体资源，包含 controls 属性让用...

今天团队同事接到一个需求，需求是这样的，点击页面按钮弹出红包弹窗，显示黑色遮罩层，点击遮罩层背景和弹窗关闭按钮要关闭弹窗，于是我就做了一个Demo出来，方便以后下次自己...

HTML5单选框、复选框、下拉菜单、文本域 单选框的实例代码，代码如下所示： 1单选框代码： input type=radio name= id= input type=radio name= id= input type=radio name= id= 效果： 复选框 2复选框代码：...

本篇介绍如何使用 Bootstrap File Input（最好用的文件上传组件）来进行图片的展示、上传，以及如何在服务器端进行文件保存。 一、先来看效果图吧 二、引入插件的样式和脚本 link type...

因为IOS最新版微信取消了浮窗功能，小程序后台狠毒用户反馈进入不方便了，目前公众号还支持浮窗，于是需求出来了，浮窗一个H5，在H5中一键打开小程序，阅读文档得知，微信对公众...

前言 前端实现的水印基本都是不安全的，可被破解的~.~ 水印 水印（watermark）是一种容易识别、被夹于纸内，能够透过光线穿过从而显现出各种不同阴影的技术。 实现 先创建一个 wra...

HTML5基于flash实现播放RTMP协议视频，具体代码如下所示： !doctype htmlhtmlheadmeta charset=utf-8titleVideo.js 7/titlelink href=css/video-js.min.css rel=stylesheetstylebody{background-color: #191919}.m{ width: 640px; height...

前言 电子签名通俗来说就是通过技术手段实现在电子文档上加载电子形式的签名，其作用类似于纸质合同上的手写签名或加盖的公章。虽然电子签名多年来合法性一直遭到质疑，但其在...

用什么代码实现？不允许有白色底色产生，因为手机高度不一样 设计图要标准（750）确认是背景图（通屏底图）应用场景：移动端宣传页面或者活动页面 错误的写法：加到div中结合图...

本文主要介绍了如何使用canvas绘制可移动网格的示例代码，分享给大家，具体如下： 效果 说明 这个是真实项目中遇到的需求，我把它抽离出来，屏蔽了那些业务相关的东西，仅从代码...

http://html5test.com/ 视频和音频代码检测 function CheckAudio(){ var myAudio=document.createElement(audio); if(myAudio.canPlayType){ if(!=myAudio.canPlayType(audio/mpeg)){ document.write(你的浏览器支持mp3格式br/); } if(!=my...

在开发移动端时，不像开发PC端那么方便，有控制台，可以查看各种网络请求，以及打印的日志。 那么Tencent团队就开发出了一款工具，模拟PC端的控制台，可以查看打印日志以及网络请...

演示图如下： HTML代码片段： !DOCTYPE HTMLhtml head ti【出处：美国高防服务器 网络转载请说明出处】tle404/title meta charset=utf-8 / meta name=viewport content=width=device-width, initial-scale=1, user-scalable=...

为了保障信息安全，防止重大信息泄露，并且能够锁定泄露用户，需要对页面展示的图片加入当前用户信息的盲水印，即最终图片外观看起来和原图一样，但是经过解码以后可以识别出...

最近一直做关于装修的一个项目，后台功能实现很快，但是前台界面展示确实遇到不少的问题。 问题1、下拉框选择不管用，选中之后没有变。如图 当我选择其他的选项时，不发生任何...

本文主要介绍了HTML5 canvas实现的静态循环滚动播放弹幕，分享给大家，具体如下： 使用方法和API 语法如下： canvasBarrage(canvas, data); 其中： canvas canvas 表示我们的 canvas 画布元素，可以直...

本文主要介绍new XMLHttpRequest()监听附件上传进度，解决优化loading长时间加载，用户等待问题 一、存在问题 经测试发现，new XMLHttpRequest()在附件上传请求中，WIFI关闭切4G上传，上传进度不...

简介 拖拽（Drag/Drop）是一个很普遍、很常用的操作，即抓取一个对象后，放到想要放的地方。 在H5中，拖拽是一个标准操作，任何元素都可以拖拽！！ 但是！！ 想要实现拖拽，需要添...

问题记录： 20210118，记录一下一个小问题，收到来自同事的bug反馈，说我们的H5页面，在微信内置浏览器下显示有问题，然后丢了个图过来，发现里面文字很大，文字的位置也有点偏移...

情况：引入SDK 的签名不报错与调试工具生成的结果也是一模一样，但是使用hideMenuItems没有小效果，不会报错。 解决方式：把要执行的wx.hideMenuItems()放到wx.ready这里面就有生效了 wx.con...

一.列表元素 1.ul元素 ul为无序列表，各个列表项之间没有顺序级别之分，通常是并列的，排序不分先后。 语法为： ul li列表项1/li li列表项2/li li列表项3/li .../ul 例： !DOCTYPE htmlhtmlheadme...

正确的实现代码如下： !doctype htmlhtml lang=zhhead meta charset=UTF-8 title个人简历/title/headbody table width=800 border=1 align=center cellpadding=10 cellspacing=0 captionh3个人简历/h3/caption tr td colspan=5 bgcolor=#9F...

前言 利用HTML5，css，js实现爱心树 以及 纪念日期的功能 网页有播放音乐功能 以及打字倾诉感情的画面，非常适合情人节送给女朋友 具体的HTML代码 具体只要修改代码里面的男某某和女...

如果我们用Canvas实现了一些动画效果，需要将它回放出来，很多人通常就是用录屏工具将屏幕内容录下来播放，很少有人知道，Canvas可以直接通过现代浏览器支持的 Media Streams API 来转成...

目录 前言 九宫格背景制作 九宫格跑马灯效果制作 确定停止时间 前言 上次说过在看一些关于0代码开发平台ivx，前一段时间忙完考试最近跟着教程0代码实现一个九宫格抽奖，哈哈哈感...

最近做项目过程中，老大提了个很奇葩的要求 背景图铺满页面，他要求有滚动条可以滑动，他给我讲的思路是用js 获取背景图片的高，在获取当前窗口的高，两者比较，当窗口的高小于...

不知道老网民们还记不记得这个魔性的时钟插件： 作为网上冲浪十数载的网虫，不久前看到这个图瞬间破防，直接梦回10年前的QQ空间，感叹一下岁月蹉跎、时光荏苒、青春不在、不胜...