![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5
昵称2-20个字符
这个作者很懒,什么都没留下…
展开
-
Bye World
撤了撤了 我转做销售了各位加油原创 2020-10-27 00:32:48 · 315 阅读 · 1 评论 -
使用js实现多个video,一个播放其他暂停
html <div class="videoContent"> <div class="videoMod"> <h3>海贼王:路飞成功收编小弟,草帽海贼团全员都在聆听他的誓言!</h3> <video src="./video/video1.mp4" controls >您的浏览器不支持 video 标签。</video> </div> <div class="videoMod"&原创 2020-06-29 19:11:06 · 2873 阅读 · 0 评论 -
媒体查询+scss+flex布局移动端开发
rem适配方案1.让一些不能等比自适应的元素,达到当设备尺寸发生改变的时候,等比例适配当前设备。2.使用媒体查询根据不同设备按比例设置html的字体大小,然后页面元素使用rem做尺寸单位,当html字体大小变化元素尺寸也会发生变化,从而达到等比缩放的适配。技术方案:scss+rem+媒体查询首先,我们设置再不同屏幕尺寸下 html字体的大小。$no: 15;为其建立单独的scss文件存储。// 我们此次定义的划分的份数 为 15$no: 15;// 设置常见的屏幕尺寸 修改里面的html文字原创 2020-05-22 15:30:11 · 545 阅读 · 0 评论 -
红米手机适配 H5适配 移动端适配问题
这几天做个H5页面,采用的媒体查询+scss+rem的方式做的适配。测试中遇到了一个问题,其他设备上布局都正常,唯独红米出现了bug(两侧有余白)红米手机出问题图:正常显示图应该是这个手机机型没有兼顾到,使用@media(媒体查询)没有包含在内。就写了两句简单的代码:var w=window.screen.width; alert(w);用红米note7pro手机打开这个页面,就能看到弹出的屏幕宽度393px,真是奇葩;原创 2020-05-21 12:14:17 · 762 阅读 · 0 评论 -
html+css实现移动端左右移动导航
html+css实现移动端左右移动导航实现原理:1.最外层元素上宽度设置成固定宽度;2. 第二层元素宽度设置为width: max-content;最内层各个li元素左浮动设置其间的间距;固定每个li的宽度;<div class="picShow"> <ul class="picWrap clearFloat"> <li>...原创 2020-04-12 15:23:23 · 1371 阅读 · 0 评论 -
监听input输入内容
jq方法// 监听input输入的内容$("input").on('input',function(){ console.log($(this).val())});js方法var inputs=document.getElementById("inputs"); inputs.οninput=function(e){ console.log(inputs.valu...原创 2020-03-24 11:21:03 · 225 阅读 · 1 评论 -
微信h5页自定义分享标题描述图标
// 微信分享 $(function(){ function initWxShare() { var ajaxurl = "";//公众号信息存储 var link = location.href.split("#")[0];//获取url替换#后面的部分hash值 var title = "这里是标题...原创 2019-12-24 15:49:00 · 1067 阅读 · 0 评论 -
audio在苹果端音乐不自动播放解决方法
audio标签上加个id 然后调用 audioAutoPlay();函数 将audio的id作为参数传入<audio id="music" autoplay="true" loop controls preload src="music/sss.mp3"></audio><script> function audioAutoPlay(id){ va...原创 2019-12-12 17:18:18 · 1090 阅读 · 0 评论 -
aria-hidden="true"的作用
图标的可访问性现代的辅助技术能够识别并朗读由 CSS 生成的内容和特定的 Unicode 字符。为了避免 屏幕识读设备抓取非故意的和可能产生混淆的输出内容(尤其是当图标纯粹作为装饰用途时),我们为这些图标设置了 aria-hidden=“true” 属性。如果你使用图标是为了表达某些含义(不仅仅是为了装饰用),请确保你所要表达的意思能够通过被辅助设备识别,例如,包含额外的内容并通过 .sr-o...原创 2019-12-02 16:28:58 · 4668 阅读 · 0 评论 -
video常用属性
video常用属性属性值功能描述controlscontrols是否显示播放控件autoplayautoplay设置是否打开浏览器后自动播放widthPilex(像素)设置播放器的宽度heightPilex(像素)设置播放器的高度looploop设置视频是否循环播放(即播放完后继续重新播放)preloadpreload设...原创 2019-10-14 15:58:27 · 1348 阅读 · 0 评论 -
video,audio currentTime 失效无作用注意点 currentTime修改时间失败解决方法
video,audio currentTime 失效无作用 注意点自己试着写video的控制台,在写拖动进度效果踩坑;有引用Jquery,所以获取元素定义元素时都用的$("element")&&$elementcurrentTime方法 是添加在video||audio单个元素上的.。而JQ中$("element")&&$element获取的是数组对象,...原创 2019-10-11 18:54:07 · 3817 阅读 · 0 评论 -
Iconfont-阿里巴巴矢量彩色图标显示黑白解决方法 矢量图标
使用阿里图标 iconfont 时发现彩色的图标都变成黑色的了。查阅后发现 iconfont.css 只能设置单色的图标,要想使彩色图标,需要使用 svg (symbol)模式 Unicode。方法如下symbol引用(阿里巴巴矢量图标库使用方法)这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。特点:支持多色图标了,不再受单色限制。通过一些技巧,支持像字体那...原创 2019-10-09 18:37:43 · 13140 阅读 · 0 评论 -
css3循环图片
使用html+css3完成循环图片动画效果//html结构<div class="autoplay_img"> <div class="img_wrap clear"> <img src="./img/detail/photo-1.jpg" alt=""> <img src="./img/detail...原创 2019-09-25 17:41:15 · 402 阅读 · 0 评论