Создать всплывающее окно с автоматической шириной и высотой - PullRequest
0 голосов
/ 28 марта 2012

Привет,

Я хочу создать всплывающее окно, содержимое которого будет поступать извне, и я хочу поместить его в тег iframe всплывающего окна. Я не уверен, сколько контента придет, это будут либо большие, либо небольшие данные. Поэтому я хочу, чтобы ширина и высота всплывающего окна автоматически настраивались на ширину и высоту содержимого, а если содержимое слишком велико (если оно превышает ширину и высоту тела), тег div содержимого должен автоматически прокручиваться. способ достичь ... код ценится ...

Вот мой код, который, я считаю, будет работать (но он не дает правильного вывода)

<style>
 #irmNPopupContainer{
    display:inline-block;
    border:8px solid rgba(0,0,0,0.4);
    border-radius:8px;      
   }
   #irmNPopupHdr{
    height:30px;
    width:100%;
    background:#e4e4e4;
   }
   #irmNPopupHdr span:first-child{
    padding:0px 0px 0px 5px;
    font-weight:bold;
    color:#333333;
   }
   #irmNPopupHdr span:last-child{
    position:absolute;
    right:2px;
    top:2px;
    cursor:pointer;
   }
   #irmNPopupContent iframe{
    width:100%;
    height:100%;
   }
  </style>

 <body>
   <div id="irmNPopupContainer">
     <div id="irmNPopupHdr"><span>Agreement Search</span><span><img src="badge_cancel_32.png"></span></div>
     <div id="irmNPopupContent">
       <iframe src="http://www.w3schools.com" frameborder=0>
       </iframe>
     </div>
   </div>
 </body>

1 Ответ

1 голос
/ 28 марта 2012
  1. Y вы не используете таблицу вместо div?
  2. Вы также хотите установить высоту и ширину фрейма? Если да, тогда вам нужно использовать плагин easyxdm для изменения размера ifrmae. Здесь есть ссылка на плагин (это будет работать для междоменных доменов. Если домены одинаковые, то для этого плагина нет необходимости, вы можете установить ширину и высоту с помощью кода JS) http://easyxdm.net/wp/2010/03/17/resize-iframe-based-on-content/
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...