2
我需要打开一个弹出窗口到自定义大小。使用jQuery移动文档的建议,当我用ajax加载页面时(在同一个.html文档中),我可以获得自定义大小。当我有一个单独的.html文档时,它不会加载我指定的自定义宽度。调整对话框宽度jQuery Mobile到非Ajax加载页面
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" >
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
<script src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
<style>
.ui-dialog .ui-header,
.ui-dialog .ui-content,
.ui-dialog .ui-footer {
max-width: 800px;
margin: 10% auto 15px auto;
}
</style>
</head>
<body>
<div data-role="page" id="popup">
<div data-role="content">
<a data-role="button" href="#" data-rel="back">back</a>
</div>
</div>
</body>
</html>
这是代码。如果我在同一个文件中链接到它,并且只使用
<a href="#popup" data-rel="dialog">popup</a>
它工作正常。如果你想改变宽度(jQuery Mobile Dialog docs),你可以看到jQuery Mobile添加的css规则。
我回答了我自己的问题。我发现,使用ajax加载时,页面被提取时,它只会从目标页面获取内容。如果我想提供一些自定义CSS应用到目标页面,我需要在父页面(或调用弹出窗口的页面)上。我会在8小时后立即回答这个问题。 – forrestranger
要么在父页上,要么在div role = page(包括JS代码!)内。或者,您可以禁用ajaxLoading并且不让jqm动态加载页面,而是以“经典”方式加载浏览器 – Leon