Существует свойство масштабирования в CSS с примерами здесь What Does 'zoom' do in CSS?
Вы можете определить масштаб увеличения, сравнивая новый размер окна до нужного размера, предназначенного для и масштабирования, что путь , Если вы используете jQuery, вы можете обнаружить изменения в событии изменения размера окна iFrame (я думаю).
// Assuming you've designed your page for a 1024px width
var designWidth = 1024;
$(window).resize(function() {
var w = $(window).width();
/* calculate new zoom */
var zoom = parseInt(w/designWidth * 100).toString() + "%";
// Assuming all your content to resize is in an element with id "content"
$("#content").css("zoom", zoom);
});
Грязный примером может быть что-то вроде:
page1.html
<!DOCTYPE html>
<html>
<body>
<iframe width="50%" src="page2.html"></iframe>
</body>
</html>
page2.html
<!DOCTYPE html>
<html>
<body>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript">
$(window).resize(function() {
resize();
});
$(document).ready(function(){
resize();
});
var designWidth = 300;
function resize() {
var w = $(window).width();
var zoom = parseInt(w/designWidth * 100).toString() + "%";
$("#content").css("zoom", zoom);
}
</script>
<div id="content">I get bigger and smaller!</div>
</body>
</html>
Это работает для меня в последней версии Chrome.
Это отлично работает !!! Благодаря! – Zach