<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <t…
关于手机端适配的问题(rem,页面缩放) 96 进击的小前端 关注 2018.02.02 13:57 字数 320 阅读 19评论 0喜欢 0 相信很多和会和我碰到一样的情况,就是你用rem去写移动端的时候,如果想引用别的UI库的时候,自己页面写的是rem单位,而ui库的css里面写的是px,大家都知道,rem是在html上设置font-size 字体大小.然后,,然后ui库的里面的px 会和 rem冲突,很麻烦,搜了很多办法都没找到好的解决办法!!! rem的做法 (function() {…
<!-- 判断浏览器是否为手机端 -->  <script>     // class     ! function(navigator) {         var userAgent = navigator.userAgent;         documentElement = document.documentElement;         if (userAgent.match(/micromessenger\/5/gi)) {             document…
网上的代码杂七杂八,  我搞个简单明了的!!  你们直接复制粘贴,  手机上 电脑上 可以直接测试!!! 上图: 上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <me…
输入相同域名,在pc端和移动端会出现不同的页面效果,一种是用栅格系统实现自适应, 更多的是设计两套不同的模板和两个二级域名或者一个主域名和一个二级域名(就是有区别就可以了); js代码判断浏览器的用户代理头类别从而实现不同跳转 <script type="text/javascript"> (function(){ var ua = window.navigator.userAgent.toLowerCase(); if (!(/Android|webOS|iPhone|i…
window.ontouchmove=function(e){ e.preventDefault && e.preventDefault(); e.returnValue=false; e.stopPropagation && e.stopPropagation(); return false; } 微信浏览器禁止页面下拉查看网址(不影响页面内部scroll) 此类事件是手机touchmove默认事件行为,可以通过js代码隐藏事件: $(‘body’).on(‘touchm…
<script type="text/javascript"> $(function(){ // 获取终端的相关信息 var Terminal = { // 辨别移动终端类型 platform : function(){ var u = navigator.userAgent, app = navigator.appVersion; return { // android终端或者uc浏览器 android: u.indexOf( || u.indexOf(, // 是否为i…
我的网盘:http://pan.baidu.com/s/1jIib2Ay…
因为项目需要,别人想让我给他写一个个人博客,并且给了我一个其他人的网页,可以点此查看.有的同学可能说了,第三方博客框架这么多,为什么还要去手写的,你说这个有可能是没有看到打开这个博客. 样式介绍 给大家看一下这个网页的大体样式. 这个界面可以说是非常漂亮,整体也是一个响应式布局,总体来说还算不错.但是抛开页面设计,这个网站有一个致命的缺点,就是没有做懒加载,这么多页面其实就是一个HTML文件,所有的资源图片以及文字信息等全部是一次性加载,所以你想打开这个界面还是比较困难的,需要等待一些时间. 我…
document.addEventListener('visibilitychange', function() { console.log(isHidden() + "-" + new Date().toLocaleTimeString()) }); function getHiddenProp() { var prefixes = ['webkit', 'moz', 'ms', 'o']; // if 'hidden' is natively supported just retu…