высота встроенного фрейма

Сообщение **samsomus** » 18 фев 2020, 10:47

Добрый день. Форум перерыл, ответа не нашел.
Билдер 12.5. Встроенный фрейм с сетке верстки. Как сделать размер (именно высоту) фрейма автоподстраиваемой под размер содержания данного фрейма?

Сообщение **spoon** » 18 фев 2020, 11:23

В 15.3 проблем нет

Сообщение **samsomus** » 18 фев 2020, 12:43

каким образом? в настройках нет такого. Сторонними средствами?

Сообщение **Eric** » 18 фев 2020, 19:41

В исходный код страницы, или <HTML> и jquery-1.12.4.min.js залейте в папку js каким либо способом.
Между тегами <head>

Код: Выделить всё

<script src="js/jquery-1.12.4.min.js"></script>

Между тегами <body> или <head>
ID вашего фрейма #InlineFrame1

Код: Выделить всё

<script>
$(function() {
   $('#InlineFrame1').load(function(){
      var target = this;
      var content = $(target).contents().find('body');
      $(target).height($(content).outerHeight(true));
 
      $(content).on("DOMSubtreeModified click", function (event){
         setTimeout(function(){
            $(target).stop().animate({height: $(content).outerHeight(true)}, 200);
         }, 400);
      });
   });
});
</script>

Что лишнее, я не виноват. Вычеркнуть :-):

https://snipp.ru/jquery/auto-height-iframe

Сообщение **spoon** » 18 фев 2020, 19:52

Eric, где откапали эти var))

Сообщение **Eric** » 18 фев 2020, 19:54

Скинул сылку. Но работает :-):

Ща еще че нибудь навояем )))

Отправлено спустя 2 часа 49 минут 9 секунд:
Фрейм через <HTML>

Код: Выделить всё

<iframe name="my_frame" 
src="./page.html" 
width="100%" frameborder="0" 
scrolling="no"
onload="HeightAuto(this)">
</iframe>

<script>
function HeightAuto(obj) {
obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
}
</script>

Сообщение **samsomus** » 19 фев 2020, 10:26

Eric,
первый вариант пишется все в файле в который вставлен фрейм? Что-то не едут лыжи у меня... Не работает.

Вот этот код работает, но при изменении цифр 200 и 400 перестает работать. Т.е. после изменения высоты, просто схлопывается в линию

Код: Выделить всё

<iframe class="frame" src="https://site.ru/zakaz/"></iframe>

<script>
$(function() {
   $('.frame').load(function(){
        var target = this;
        var content = $(target).contents().find('body');
        $(target).height($(content).outerHeight(true));

        $(content).on("DOMSubtreeModified click", function (event){
            setTimeout(function(){
                $(target).stop().animate({height: $(content).outerHeight(true)}, 200);
            }, 400);
        });
    });
});
</script>

не понятно каким образом настроить ширину фрейма, оно всегда 300рх

Сообщение **Eric** » 19 фев 2020, 13:13

В исходный код страницы, или <HTML> вставку. Правильность не гарантирую, обрезал как смог. У меня работает. Второй вариант тоже работает и более идеологически правильный.
Первый:

Код: Выделить всё

<script>
$(function() {
   $('#InlineFrame1').load(function(){
      var target = this;
      var content = $(target).contents().find('body');
      $(target).height($(content).outerHeight(true));
      $(content).on();
   });
});
</script>

Второй вариант. Не используя фрейм билдера, все через <HTML> вставку (не использовать div).
Ширина фрейма width="100%" все через HTML.

Сообщение **samsomus** » 19 фев 2020, 14:32

Eric, спасибо!
Но есть все же заковырка. После вставленной страницы в том же фрейме продолжается содержимое пустое (похожее на подвал, только растянутое на размер страницы)
поиграл параметром " + 'px'", похоже от него и зависит, но убрать пустоту не удалось, только увеличивается, если в минус, то содержимое полезное теряется

spoon, все-таки хотелось бы увидеть штатные средства билдера 15 применительно к этой задаче. Как вы использовали?

Нашел еще такой вариант:

Код: Выделить всё

<script language="javascript" type="text/javascript">
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>


<iframe src="https://............ru/zakaz/" width="100%" frameborder="0" scrolling="no" onload="resizeIframe(this)" />

работает как надо, но тоже не без косяков - нет подвала страницы, в которую вставлен фрейм! А еще меню пропадает

PS . Eric, Я понял! скрипт по 2-му варианту работает только на увеличение высоты фрейма, после того как его содержимое стало короче по высоте пустое пространство заполняется цветом подвала, а сам фрейм не уменьшает высоту почему-то.

Сообщение **Eric** » 19 фев 2020, 15:38

У меня wwb14 и wwb15. На v12 не проверял, скачивать лениво.
wwb v15.3

Сообщение **spoon** » 19 фев 2020, 16:01

Eric, сразу видно что вы без работы)))

Сообщение **samsomus** » 19 фев 2020, 16:30

Eric, ни один из 4 вариантов у меня на 15 билдере не заработал, странно. Проверил в 3-х браузерах

1111.png

Сообщение **Eric** » 19 фев 2020, 17:43

сразу видно что вы без работы)))

spoon,

Сижу ерундой страдаю. Завтра в грузчики пойду устраиваться :-)

samsomus, у меня работает Chrome, Firefox. Ну-у, я что, обманываю что ли, ну вот же оно, вот... :-):

И никакого схлопывания и прокуруток

Сообщение **samsomus** » 19 фев 2020, 17:50

сейчас и 5й вариант попробовал - нифига, хром, фаерфокс и опера - не работает, скрин уже показывал

Сообщение **Eric** » 19 фев 2020, 17:53

Вы ее на сервере опубликуйте, а не через просмотр.

Отправлено спустя 2 минуты 34 секунды:
И у меня через просмотр не работает ))) А собственно че оно должно работать, скрипты опубликованы?
Denwer или XAMPP поставьте.

Сообщение **samsomus** » 20 фев 2020, 10:01

XAMPP стоит (вордпресс на нем кручу), ок сейчас попробую на сайт кинуть/

Да, работает, но опять тот же косяк, оно не уменьшает высоту когда содержимое уменьшается, только в сторону увеличения.
И еще, если нажимаешь ссылку внутри фрейма, то открывшееся окно оказывается не сначала экрана, можно как-то начало фрейма (верх) подгонять при открытии к верху экрана?

Кто сейчас на конференции

Добро пожаловать на форум!