Итак, у меня есть веб-приложение, которое я хотел бы, чтобы пользователи просматривали, как если бы оно было на Android / Iphone. Я рассмотрел несколько решений, каждое из которых имеет по крайней мере одну вещь с ними. Так что моя работа заключается в том, чтобы загрузка веб-приложения была в середине iframe, который находится в середине изображения iphone, который его создает. Безобразно, но для того, что я хочу, оно идеально, за исключением того, что iframe перемещается по экрану в зависимости от размера экрана, поэтому не всегда находится посередине кадра.
Чего я достиг до сих пор.
<html>
<head>
<meta name="keyword" content="key words, keywords" />
<meta name="description" content="brief and to the point description of the web page." />
<meta name="robots" content="all" />
<style>
#container {
position: absolute;
top: 10%;
left: 45%;
width: 367px;
height: 717px;
margin-top: -50px;
margin-left: -75px;
}
#browser {
position: absolute;
top: 23%;
left: 46%;
margin-top: -49px;
margin-left: -64px;
border: none;
overflow: hidden;
}
</style>
</head>
<body style ="background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#C7000D), to(#2E0002))"; >
<div id="container"><img src="images/ip4.png" style=""></div>
<iframe id="browser" src="http://server.com/index.php?id=5" width="320px" height="482px" scrolling="no">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
Есть ли какие-либо полные способы доказательства, чтобы каждый раз вставлять iframe в середину изображения?
Просмотреть текущий результат здесь изображения результатов