Можно сжать содержимое iframe?

Ответ 1

Я боюсь, что нет. Единственный вариант - использовать модификаторы CSS для сайта, чтобы уменьшить размер шрифта и элемента.

Ответ 2

CSS3 может справиться с этим. Этот бит кода должен обрабатывать большинство браузеров или просто уменьшать его в соответствии с вашими потребностями. Не нужно "настраивать" существующие CSS:

iframe {
  -moz-transform: scale(0.25, 0.25); 
  -webkit-transform: scale(0.25, 0.25); 
  -o-transform: scale(0.25, 0.25);
  -ms-transform: scale(0.25, 0.25);
  transform: scale(0.25, 0.25); 
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

Или, если вы хотите встроенный стиль, например, просто firefox:

<style>
  #IDNAME {
    -moz-transform: scale(0.25, 0.25); 
    -moz-transform-origin: top left;
  }
</style>

Затем, конечно, просто добавьте ID в ваш iframe:

<iframe id="IDNAME" src="http://www.whatever.com"></iframe>

Ответ 3

Если вы управляете содержимым Iframe, вы можете найти этот маленький взломанный мой полезный ресурс: http://futtta.be/squeezeFrame/

Это автономный javascript-браузер с поперечным браузером, который пытается автоматически настроить размер страницы, на которую он звонил, на доступный размер iframe, используя css-масштаб и moz-transform.

Ответ 4

Вы абсолютно можете это сделать, просто отлично.

Только оговорка - вам нужно преобразовать iframe и установить абсолютное значение:

iframe {
  /* Set the width of the iframe the size you want to transform it FROM */
  width: 1108px;
  height: 710px;
  /* apply the transform */
  -webkit-transform:scale(0.25);
  -moz-transform:scale(0.25);
  -o-transform:scale(0.25);
  transform:scale(0.25);
  /* position it, as if it was the original size */
  position: absolute;
  left: -400px;
  top: -200px;
}

Чтобы посмотреть пример, выполните следующие действия: http://jsfiddle.net/8DVNa/

Ответ 5

Ну, короче нет.

Вы можете использовать встроенный CSS для установки ширины/высоты до 600 пикселей, а затем установить overflow:hidden

Ответ 6

У меня есть несколько торговых сайтов, которые я портировал на новый сайт и после фиксации точки фокусировки view/vantage, что я получил... сайт идеально подходит для моего iframe на странице... разница в размере шрифта лучше, чем проблема фокуса... Я думаю, это был хороший компромисс

    #wrap {  
        width: 115%;
        height: 2000px;
        padding: 0;
        overflow: hidden;
}
    #frame {  
        -ms-zoom: 0.5;
        -ms-transform-origin: 0 0;
        -moz-transform: scale(0.75);
        -moz-transform-origin: 0px 75px;
        -o-transform: scale(0.75);
        -o-transform-origin: 0px 75px;
        -webkit-transform: scale(0.75);
        -webkit-transform-origin: 0 0;
}
    #frame {
        width: 115%;
        height: 2000px;
        overflow: hidden;
}

    <div id="wrap">
        <iframe id="frame" src="http://hempseedoilsoap.com/" scrolling="auto" align="center"></iframe>
    </div>