随笔分类 -  HTML5

Html5 监听拦截Android返回键方法详解
摘要：浏览器窗口有一个history对象，用来保存浏览历史。 如果当前窗口先后访问了三个网址，那么history对象就包括三项，history.length属性等于3。 history对象提供了一系列方法，允许在浏览历史之间移动： window.history.back()：移动到上一个访问页面，等同于浏 阅读全文
posted @ 2018-04-13 17:29 申文哲 阅读(7734) 评论(0) 推荐(0)
HTML5 移动页面自适应手机屏幕四类方法
摘要：1、使用meta标签：viewport H5移动端页面自适应普遍使用的方法，理论上讲使用这个标签是可以适应所有尺寸的屏幕的，但是各设备对该标签的解释方式及支持程度不同造成了不能兼容所有浏览器或系统。 viewport 是用户网页的可视区域。翻译为中文可以叫做"视区"。 手机浏览器是把页面放在一个虚拟 阅读全文
posted @ 2017-03-20 15:35 申文哲 阅读(89468) 评论(0) 推荐(9)
jQuery相同id元素 全部获取问题解决办法
摘要：问题：今天在做页面链接的点击效果时，让部分a链接跳转到同一个地址,即使使用$().each()也同样无法获取所有相同id的值。 用以下方法只有第一个a链接点击可以正常跳转 例如： html代码： jquery代码： 解决点击每个a链接都可以正常跳转的办法如下： 修改jquery代码即可： 阅读全文
posted @ 2017-03-09 18:04 申文哲 阅读(5351) 评论(0) 推荐(2)
让IE系列支持HTML5的html5shiv.js和respond.min.js
摘要：HTML5越来越成为主流，被广大搜索引擎所使用，但IE对HTML5的支持却常被人唾弃。 解决方案有两种： 1.为网站创建多套模板，通过程序对User-Agent的判断给不同的浏览器用户显示不同的页面，比如优酷网就是采用的这种模式。（缺点：工程量大） 2.使用javascript来使不支持HTML5的 阅读全文
posted @ 2016-11-21 18:28 申文哲 阅读(3504) 评论(0) 推荐(0)
div非弹出框半透明遮罩实现全屏幕遮盖css实现
摘要：IE浏览器下设置元素css背景为透明： 非IE浏览器下设置元素css背景为透明： 兼容各类浏览器设置css背景为透明办法,即两者合并设置css： （ie 不支持 rgba，所以rgba不会起作用） 另：RGB与16进制色互转网站：http://11.1m86.com/ 1.弹出框默认状态下是隐藏的， 阅读全文
posted @ 2016-09-20 14:42 申文哲 阅读(19174) 评论(0) 推荐(0)
解决h5的video标签，android、ipad客户端播放正常，iphone客户端无法播放
摘要：在做html5时插入一个视频播放标签video后，测试时android、ipad客户端播放正常，唯独iphone自带浏览器无法播放。 解决办法： 判断用户所使用客户端访问h5页面时是iphone时，点击播放视频触发的是一个视频url链接,而非video标签。 js判断代码如下：此代码引用Github 阅读全文
posted @ 2016-09-06 11:24 申文哲 阅读(12750) 评论(3) 推荐(1)
点击弹出一个视频层,然后点击页面任何地方层隐藏，并带有遮罩层修饰
摘要：1.HTML代码 点击按钮: 弹出视频播放层: 2.CSS代码 3.jQuery代码 阅读全文
posted @ 2016-08-29 16:36 申文哲 阅读(7362) 评论(0) 推荐(0)
HTML5横竖屏提示
摘要：HTML代码： CSS判断代码： 阅读全文
posted @ 2016-08-29 11:07 申文哲 阅读(678) 评论(0) 推荐(0)
PC端和移动端地址适配
摘要：判断当前页面的打开方式是pc还是移动设备，如果是移动设备，跳转到对应移到端网站的方法： 方法一、还是用@media screen 思路：css使用媒体查询，当屏幕小于760px时，使某个元素的样式发生改变，然后通过js检测到这个改变，就可以知道现在切换到移动端了 css代码： js代码： 方法二、通 阅读全文
posted @ 2016-08-19 12:06 申文哲 阅读(733) 评论(0) 推荐(0)
Form的enctype="multipart/form-data"作用
摘要：首先看下enctype三种属性的作用： 不对字符编码。 在使用包含文件上传控件的表单时，必须使用该值。 其中表单中enctype="multipart/form-data"的意思，是设置表单的MIME编码，是类上传二进制数据方式， 所以form里面的input的值以二进制的方式传过去的。 默认情况， 阅读全文
posted @ 2016-08-09 16:24 申文哲 阅读(2142) 评论(0) 推荐(1)