调整jQuery手机中的一个页面的屏幕大小

我在调整我的应用程序中的一个页面的大小时遇到问题。调整jQuery手机中的一个页面的屏幕大小

虽然我使用

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, target-densitydpi=device-dpi"/>

设立我的网页我想调整特定页面的宽度，因为它显示了一个更宽的图像的“正常”的大小。但是，当我试图做调整它像

<div date-role="page" id="organigram" style="min-width:1000px;">

或通过CSS：

#organigram > .ui-page { 
min-width: 1000px; 
}

它为我的所有网页的宽度，直到我参观了这个特定的一个与图像。当我通过页面页眉中的“后退”或“主页”按钮移回时，所有尺寸都恢复正常（设备宽度），并且图像页面保持新的最小宽度。然而这对我来说毫无用处。我试图只改变页面内的图像的宽度，但是这导致根本没有宽度改变。有任何想法吗？如果需要额外的代码，我会提供它。提前致谢！

/编辑：我找到了通过使用JavaScript的工作。当页面打开时，我的脚本开始覆盖整个页面

document.getElementById('organigram').innerHTML = myPageContent;

无论如何，这不是一个解决方案。

来源

2013-05-21 blaluma

jQUERY移动页面的问题是当你改变一个页面的尺寸时，所有的页面都会改变，这是可以理解的，它们都需要适合一个视口。

只能在页面处于活动状态时更改页面宽度。为此，您需要使用jQuery Mobile页面事件：

#pageId是您想要修改的页面的ID。

$(document).on('pagebeforeshow', '#pageID', function(){  
    $(this).width(1000); 
}); 

$(document).on('pagebeforehide', '#pageID', function(){  
    //Return page width to the correct size 
});

如果你从未使用jQuery Mobile的页面事件来看看我的其他答案的工作，你会发现很多有用的信息：jQuery Mobile: document ready vs page events

来源

2013-05-21 10:26:33 Gajotres

但理论上我还是覆盖PAGE-宽度与上面显示的.innerHTML不同，不是从开始，而是在激活时，所有页面都必须调整到新的宽度，而不是。那为什么这样工作呢？此外，其他页面不应该变回设备宽度，一旦我从页面移回图像，他们会这样做。 – blaluma

（错过评论编辑时间：<）除此之外，您的答案是正确的，并且比插入新的HTML代码更简洁。 :) – blaluma

调整jQuery手机中的一个页面的屏幕大小

回答

相关问题