5***@qq.com
5***@qq.com
  • 发布:2016-07-19 15:10
  • 更新:2016-07-19 19:56
  • 阅读:4135

webview打开一个窗口 设置和浏览器一样自动缩放

分类:HTML5+

我用浏览器打开一个页面,网页会自动适应手机大小,
但是用webview open同样的页面,网页不会自动缩放,且没办法向浏览器一样用手势缩放,请问该在哪里设置呀?

2016-07-19 15:10 负责人:无 分享
已邀请:

最佳回复

Trust

Trust - 少说废话

请参考5+的webview模块中,对webviewObject设置style,中的scalable属性,并且结合meta标签中的属性来实现。
代码如下:

<!doctype html>  
<html>  
  
	<head>  
		<meta charset="UTF-8">  
		<title></title>  
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=5,user-scalable=yes" />  
		<link href="../../css/mui.min.css" rel="stylesheet" />  
	</head>  
  
	<body>  
		<header class="mui-bar mui-bar-nav">  
		    <h1 class="mui-title">标题</h1>  
		</header>  
		<div class="mui-content">  
		    <ul class="mui-table-view">  
		            <li class="mui-table-view-cell">  
		                <a class="mui-navigate-right">  
		                    Item 1  
		                </a>  
		            </li>  
		            <li class="mui-table-view-cell">  
		                <a class="mui-navigate-right">  
		                     Item 2  
		                </a>  
		            </li>  
		            <li class="mui-table-view-cell">  
		                <a class="mui-navigate-right">  
		                     Item 3  
		                </a>  
		            </li>  
		        </ul>  
		</div>  
		<script src="../../js/mui.min.js"></script>  
		<script type="text/javascript">  
			mui.init();  
			mui.plusReady(function() {  
				plus.webview.currentWebview().setStyle({  
					scalable: true  
				});  
			});  
		</script>  
	</body>  
  
</html>

请注意meta标签中的minimum-scale=1,maximum-scale=5,user-scalable=yes三个参数的设置,来实现可缩放,以及缩放的范围。

  • 5***@qq.com (作者)

    感谢您的回复,我是在当前这个页面打开一个页面做为新闻详细页,,按照您的提示,打开的那个页面可以缩放了,但是是否可以在初始化的时候定义meta标签呢??

    mui.init();

    //初始化操作

    var subpage_style = {

    top: '45px',

    bottom: '0',

    scalable: true

    };

    mui.plusReady(function() {

    var self = plus.webview.currentWebview();

    var w = plus.webview.create(self.url, self.url, subpage_style);

    w.show();

    })


    2016-07-19 20:46

  • Trust

    回复 5***@qq.com:meta标签是写在html页面里面的,您想实现哪张页面进行缩放,在制作html页面的时候进行对应参数的修改即可。


    2016-07-20 08:15

  • 5***@qq.com (作者)

    mui.plusReady(function() {

    var self = plus.webview.currentWebview();

    var w = plus.webview.create(self.url, self.url, subpage_style);

    w.show();

    })

    你看这端代码,我是通过webview.create直接打开的外部网页,是不是就没办法处理了呀


    2016-07-22 11:01

  • Trust

    回复 5***@qq.com:不能哦。


    2016-07-22 11:09

该问题目前已经被锁定, 无法添加新回复