2012-04-12 5 views
0

Как я могу:Как изменить размер iframe с внешним источником и смещать содержимое?

  1. Дождитесь внешним плавающим фрейм, чтобы загрузить
  2. Resize внешне Sourced Iframe (например: 100px х 40px)
  3. Смещение внешних источников плавающего фрейма (например: 25px х 50px)

Пример кода:

<html> 
<body> 
    <p>Here's Google's Logo Today:</p> 
    <iframe id="google_logo" src="http://www.google.com/search?q=stackoverflow"></iframe> 

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() {}); 
    </script> 
</body> 
</html> 

Я знаю, что вы не можете получить содержимое внешнего iFrame, но как насчет изменения размера и смещения?

Я также знаю, что мой пример нелепо.

ответ

0

Вы не можете запустить событие, когда внешний iframe полностью загружен, но все же возможно.

Wrap кадр в DIV

<div id="frame_wrapper"> 
    <iframe id="google_logo" src="http://www.google.com/search?q=stackoverflow"></iframe> 
</div> 

Добавьте следующий JQuery

$(document).ready(function() { 
    $("#frame_wrapper").addClass("iframe_shift"); 
}); 

Добавьте следующий CSS

#google_logo { width: 100%; height: 100%; } 
.iframe_shift { width:100px; height: 45px; position: relative; top: 25px; left: 45px; }​ 
Смежные вопросы