Изменить ширину/высоту iframe в js/jquery

Я работаю над кодом js/jquery, в котором я хочу переопределить текущий css, присутствующий в приведенном ниже html-коде.

JavaScript/JQuery:

<script>
       $("div.scribble-live").find("iframe").css("height", "200 px");
</script>

HTML-код:

<div class = "scribble-live">
   <div class = "scrbbl-embed">
      <iframe name = "ee5bdd02" width = "100%" height = "15299px" frameborder = "0" allowtransparency = "true" scrolling = "no" title = "scrbbl:event ScribbleLive Embed" src = "" class = "scrbbl-embed scrbbl-event" style = "border: none; visibility: visible; width: 50px; height: 15299px; min-width: 100%;"></iframe>
   </div>
</div>

Постановка задачи:

Приведенный выше код js/jquery, похоже, не переопределяет css ( style = "border: none; visibility: visible; width: 50px; height: 15236px; min-width: 100%;"), присутствующий в приведенном выше HTML-коде.

Я также пробовал использовать следующие сценарии, но, похоже, они не работают.

<script>
$("div.scribble-live").find("iframe").attr("height", "200px");
</script>

<script>
$("div.scribble-live").find("iframe").attr("height", "200px");
$("div.scribble-live .scrbbl-event").height("200px"); 
</script>

возможно типо? 200px не 200 px

Steven Stark 28.03.2019 23:53

Это не сработало до сих пор

flash 28.03.2019 23:55

Работает просто отлично -> jsfiddle.net/9wfLah1j

adeneo 28.03.2019 23:59
$("div.scribble-live").find("iframe").css("height", "200px");
adeneo 28.03.2019 23:59

@adeneo В моей кодовой базе display:none вроде работает, но я не знаю, почему height:200px не работает

flash 29.03.2019 00:16

Вы пробовали строку выше, с css() ?

adeneo 29.03.2019 00:19

да, я скопировал ту же строку.

flash 29.03.2019 00:19

@adeneo Я обновил свой HTML-код. Кроме того, HTML-код генерируется во время выполнения с помощью скрипта.

flash 29.03.2019 00:23

Что вы подразумеваете под "временем выполнения"? Если он сгенерирован с помощью javascript, вам, возможно, придется обернуть «setTimeout» вокруг кода, который изменяет стили.

adeneo 29.03.2019 00:24

@adeneo это работает $("div.scribble-live").find("iframe").css("display", "none"); но не $("div.scribble-live").find("iframe").css("height", "200px");

flash 29.03.2019 00:25

Тогда у вас, вероятно, есть переопределяющие стили, может быть, что-то такое !important?

adeneo 29.03.2019 00:25

Да, он генерируется через javascript. Можете ли вы дать мне знать в ответ, что мне нужно сделать?

flash 29.03.2019 00:25

Нет, у меня нет приоритетных стилей.

flash 29.03.2019 00:27

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

adeneo 29.03.2019 00:29

Вы можете добавить такую ​​задержку, чтобы посмотреть, поможет ли это -> jsfiddle.net/74hg8txL/1

adeneo 29.03.2019 00:31

Дублирование вашего предыдущего вопроса, stackoverflow.com/questions/55406588

04FS 29.03.2019 10:22
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
16
61
1

Ответы 1

Кажется, все работает. Можно рассмотреть возможность использования обратного вызова .ready() для iframe или использования setTimeout() для ожидания перед внесением изменений.

$(function() {
  setTimeout(function() {
    $(".scrbbl-event").css("height", "200px");
  }, 500);
});
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class = "scribble-live">
  <div class = "scrbbl-embed">
    <iframe name = "ee5bdd02" allowtransparency = "true" scrolling = "no" title = "scrbbl:event ScribbleLive Embed" src = "" class = "scrbbl-embed scrbbl-event" style = "background: #ccc; border: none; width: 50px; height: 15299px; min-width: 100%;"></iframe>
  </div>
</div>

Надеюсь, это поможет.

Другие вопросы по теме