在html中添加缩放meta
见代码(html)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!--<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=2.0,user-scalable=1"/>-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body onload= "bodyfinish()">
<div id="unit" style="width: 320px; height:48px; position:relative;">
<p>mogoads</p>
</div> </body>
<script type="text/javascript"> function bodyfinish(){
var include = false;
var metas = document.getElementsByTagName('meta');
var i;
console.log("for begin");
for (i=0; i<metas.length; i++) {
if (metas[i].name == "viewport") {
include = true;
metas[i].content = "width=device-width, minimum-scale=1.0, maximum-scale=2.0, user-scalable=1";
console.log("in for set meta");
break;
}
} if(!include){
console.log("set meta"); var head = document.getElementsByTagName('head')[0];
console.log("set meta after %s",head);
var newElement = document.createElement('meta');
newElement.setAttribute('name', 'viewport');
newElement.setAttribute('content', 'width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=2.0,user-scalable=1');
head.appendChild(newElement);
var s = document.getElementsByTagName('meta');
for(i=0;i<s.length; i++){
console.log("%d",i);
if (s[i].name == "viewport") {
var content_s = s[i].content;
console.log("viewport have add");
}
}
}
}
</script>
</html>
重点是这个javascript
var newElement = document.createElement('meta');
newElement.setAttribute('name', 'viewport');
newElement.setAttribute('content', 'width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=2.0,user-scalable=1');
head.appendChild(newElement);
关于meta 中参数的使用请参看
http://blog.caesarchi.com/2012/05/html-viewport-meta.html
http://www.w3.org/TR/css-device-adapt/#the-lsquomax-zoomrsquo-property
在html中添加缩放meta的更多相关文章
- 移动端网站如何开发(电脑端网站到手机端网站我们需要在html代码中添加哪个meta标签)
移动端网站如何开发(电脑端网站到手机端网站我们需要在html代码中添加哪个meta标签) 一.总结 一句话总结: 添加viewport标签:meta name="viewport" ...
- Web前端开发最佳实践(4):在页面中添加必要的meta信息
meta标签放置在HTML页面的head中,主要用于标识网站.其中基本上包含了网站的一些描述信息,例如,简介.作者等.这些信息有助于搜索引擎更准确地识别网页的内容,也有助于第三方工具抓取网站基本信息. ...
- vue项目中添加百度地图功能及解决遇到的问题详解
第一步,在百度地图开放平台 申请密钥 (如果有密钥可以省略此步骤,朋友有也可以借) 地址:http://lbsyun.baidu.com/ 第二步,创建应用并填写表单(下面链接可参考) http:// ...
- HTML Meta中添加X-UA-Compatible和IE=Edge,chrome=1有什么作用
HTML Meta中添加X-UA-Compatible和IE=Edge,chrome=1有什么作用? X-UA-Compatible是自从IE8新加的一个设置,对于IE8以下的浏览器是不识别的. 通过 ...
- vue 路由meta作用及在路由中添加props作用
vue路由meta:有利于我们处理seo的东西,我们在html中加入meta标签,就是有利于处理seo的东西,搜索引擎 在路由中传参是通过/:id传参代码如下: import Login from ' ...
- THREE.JS(如何想场景中添加物体对象)
这篇主要实现向模型对象中添加头像,并组成一个矩形 一.three.js是什么? 上篇说了点TWEEN这篇又来一根THREE是不是两兄弟啊?还真有点像,当想要做3D动画的时候,可能会考虑用TWEEN的动 ...
- 如何在CSDN博客自定义栏目中添加“给我写信”
在"自定义栏目"中添加"连接"(将自己的微博,QQ空间和CSDN博客关联起来)很多人都做过.但是添加"给我写信"这个功能,用的好像不太多.此 ...
- [Asp.net MVC]Asp.net MVC5系列——在模型中添加验证规则
目录 概述 在模型中添加验证规则 自定义验证规则 伙伴类的使用 总结 系列文章 [Asp.net MVC]Asp.net MVC5系列——第一个项目 [Asp.net MVC]Asp.net MVC5 ...
- cocos2d-x 中添加显示文字的三种方式 LabelTTF 、LabelBMFont 和 LabelAtlas
在 cocos2d-x 中有三个类可以在层或精灵中添加文字: LabelTTF LabelBMFont LabelAtlas LabelTTF 直接支持使用 TTF 字库,可以支持全部的中文,但是效率 ...
随机推荐
- bzoj 1012 维护一个单调数列
Description 现在请求你维护一个数列,要求提供以下两种操作: 1. 查询操作.语法:Q L 功能:查询当前数列中末尾L个数中的最大的数,并输出这个数的值.限制:L不超过当前数列的长度. 2. ...
- UDP通讯程序设计---6
一.函数化 1.1服务器使用的函数 创建socket----->socket 绑定地址-------->bind 接受数据-------->recvfrom 发送数据-------- ...
- js部分---for循环练习题
1有一张0.0001米的纸,对折多少次可以达到珠穆朗玛峰的高度8848: <script> /*var h=0.0001; var biao=0; for(;;) { h=h*2; if( ...
- HDU 2095 find your present (2)
HDU 2095 find your present (2) 解法一:使用set 利用set,由于只有一个为奇数次,对一个数进行查询,不在集合中则插入,在集合中则删除,最后剩下的就是结果 /* HDU ...
- Windows Git+TortoiseGit简易使用教程
转载自 http://blog.csdn.net/jarelzhou/article/details/8256139 官方教程:http://tortoisegit.org/docs/tortoise ...
- 【转】iOS websocket 及时通讯实现
原文网址:http://blog.csdn.net/manyxh/article/details/48196209 2015-09-03 by 木易哥哥 开发一个类似QQ.微信的即时IM聊天功能,做到 ...
- C函数之memcpy()函数用法
函数原型 void *memcpy(void*dest, const void *src, size_t n); 功能 由src指向地址为起始地址的连续n个字节的数据复制到以destin指向地址为起始 ...
- div下的img标签中图片的大小设定
首先html为: <div class="box1"><img src="images/more-1.jpg"></div> ...
- Visual Studio 2013 Web开发、新增功能:“Browser Link”
微软正式发布Visual Studio 2013 RTM版,微软还发布了Visual Studio 2013的最终版本..NET 4.5.1以及Team Foundation Server 2013. ...
- Nuget 摘录
1 , Creating and Publishing a Package https://docs.nuget.org/create/creating-and-publishing-a-pa ...