javascript
关注
分享
扫一扫
夕空
这个作者很懒，什么都没留下…
展开
-
H5 两个video视频的无缝切换
经过测试发现，很多手机无法自动播放，也试了很多网友的方法，还是会遇到意外情况，比如两个video切换播放问题就很头疼，最终还是在一个video上变src地址来解决，至于中间的闪烁问题，只好覆盖上一个视频的最后一帧的图片解决，虽然会卡一下，唉~ vplayer.addEventListener("timeupdate",function(e){ if(vplayer.c...原创 2019-09-15 11:24:11 · 11565 阅读 · 0 评论 -
百度地图api v1.0多坐标点（懒得申请密钥版）
<!--引用百度地图API--><style type="text/css"> html,body{margin:0;padding:0;} .iw_poi_title {color:#CC5522;font-size:14px;font-weight:bold;overflow:hidden;padding-right:13px;white-space...原创 2019-06-10 10:02:10 · 766 阅读 · 2 评论 -
手机端背景图固定fixed兼容方法
背景图background-attachment:fixed在移动端多为不支持，采用position: fixed;并JS来解决.box{width: 100%;height: 100%;}.fixedbg{position: fixed;left: 0;top: 0;z-index: -1; width: 100%;height: 100%;}<div class="box"&...原创 2019-06-03 17:51:50 · 1015 阅读 · 0 评论 -
图片热区链接在手机端关于 map area中的自适应
https://github.com/stowball/jQuery-rwdImageMaps$(document).ready(function(e) { $('img[usemap]').rwdImageMaps();});转载 2019-06-03 16:06:16 · 1997 阅读 · 0 评论 -
JS中获取 DOM 元素的绝对位置实例详解
原文：https://www.jb51.net/article/138770.htm这篇文章主要介绍了JS中获取 DOM 元素的绝对位置，详细介绍了各种获取dom元素绝对位置的方法及对应的兼容性，需要的朋友参考下吧在操作页面滚动和动画时经常会获取 DOM 元素的绝对位置，例如 本文 左侧的悬浮导航，当页面滚动到它以前会正常地渲染到文档流中，当页面滚动超过了它的位置，就会始终悬浮在左侧。...转载 2019-05-23 15:06:47 · 1709 阅读 · 0 评论 -
js事件代理
<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="UTF-8"> <title>js事件代理</title> <style type="text/css"> p{background: #bbb;color: #FFF;} </...原创 2019-05-13 16:32:28 · 137 阅读 · 0 评论 -
Masonry JS瀑布流布局
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>Masonry JS瀑布流布局</title><style>li{list-style:none;}ul{ width:90%; margin:0 auto;}...原创 2019-05-13 11:30:35 · 893 阅读 · 0 评论 -
web视差滚动浏览 - 让页面看起来有纵深立体感
根据滚动页面的位置，控制页面元素的滚动差，使页面看起来有深度有纵深立体感。放飞你的设计，让页面更具个性~~下载：https://download.youkuaiyun.com/download/zhi_jie/11172152JS代码：/*// ======视觉差滚屏效果 - 夕空 | 2019-5scrollplay(元素,消失点) 消失点也就是原始坐标会和点元素需要sc 时差属性...原创 2019-05-11 10:34:38 · 664 阅读 · 0 评论 -
JS图片加载完毕事件 & 图片等比缩放 兼容全部浏览器
var img = new Image();img.src = =$('img').attr("src");if(img.complete){ loadpic();}else{ img.onload = loadpic;}function loadpic(){ //图片加载完毕}试了很多方式，这种方式兼容全部浏览器等比缩放，需要JQ，可适应缩放也可撑满缩放2种方式：...原创 2019-05-10 15:14:52 · 672 阅读 · 0 评论 -
原生JS与jQuery操作DOM对比
原文https://github.com/nefe/You-D...原生JS与jQuery操作DOM对比You Don't Need jQuery前端发展很快，现代浏览器原生 API 已经足够好用。我们并不需要为了操作 DOM、Event 等再学习一下 jQuery 的 API。同时由于 React、Angular、Vue 等框架的流行，直接操作 DOM 不再是好的模式，jQuery ...转载 2019-05-09 11:19:21 · 278 阅读 · 0 评论 -
web端树状菜单（支持无限下级分类+修改+新增+删除）
DEMO下载：https://download.youkuaiyun.com/download/zhi_jie/10825201一开始在onethink后台里看到的，发现只能展开到3级菜单，经过我一通修改，可以无限下级分类的菜单了，可以实时修改、新增、删除，代码示例需要jquery与art-template.js（可以换成你习惯的模板引擎或修改成jq操作）注意：此树状菜单是一级一级读取jso...原创 2018-12-03 17:53:53 · 3932 阅读 · 4 评论 -
图片拖拽排序与拖拽删除
转自：https://www.zhangxinxu.com/wordpress/2016/11/html5-drag-drop-module-insert-sort-delete-demo/代码基于jQuery编写，可以省点事件。另外，兼容性是IE10+以及其他现代浏览器效果OK，不支持IE7-IE9浏览器，因为使用的是原生的HTML5 drag/drop API，一般适合开发一些工具后者内...转载 2018-11-27 14:27:06 · 1505 阅读 · 1 评论 -
点击返回顶部JS
转自：https://www.zhangxinxu.com/wordpress/2017/01/share-a-animation-algorithm-js/ //代码核心Math.easeout = function (A, B, rate, callback) { if (A == B || typeof A != 'number') { return; } B = ...转载 2018-11-27 11:53:18 · 294 阅读 · 0 评论 -
抛物线动画-加入购物车的小球
声明：demo转自https://www.zhangxinxu.com/wordpress/2013/12/javascript-js-%E5%85%83%E7%B4%A0-%E6%8A%9B%E7%89%A9%E7%BA%BF-%E8%BF%90%E5%8A%A8-%E5%8A%A8%E7%94%BB/先贴上核心代码parabola.js：/*! * by zhangxinxu(.c...转载 2018-11-27 11:33:03 · 443 阅读 · 0 评论 -
获取transform值 x y z及rotate旋转角度
CSS3的时代经常会操作transform动画属性，所以也会有想获取transform属性的时候，不过当你去取值时就懵逼了，得出来的是matrix矩阵数值，而且有一点让你恼火，当你操作过z，矩阵的长度与排序就不一样了，你无法固定的取值，（貌似用jQ的一个方法是能固定取到），为了能正常取到这些值，从网上找了一些纯js版的修修改改总算搞定了。function getTranslate(node,...原创 2018-03-29 17:25:13 · 8220 阅读 · 0 评论 -
多级联动下拉菜单 支持中英文检索
melist多级联动下拉菜单介绍多级联动下拉菜单，也可单选可多选，支持中英文混合检索，使用了jQuery.Hz2Py ol > li 里就是默认的表单，设置好name值及是radio或checkbox使用说明必要文件： jquery.js、 melist.css、 jQuery.Hz2Py-min.js、 melist.jsmelist();//初始化如果...原创 2019-10-07 10:12:57 · 999 阅读 · 0 评论