Saugat Thapa Saugat Thapa - 4 months ago 5
CSS Question

how to change height of iframe when it loads?



$('#song-link').change(function () {
var link = $('#song-link').val();
SC.oEmbed(link, {
element: document.getElementById('putTheWidgetHere')
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://connect.soundcloud.com/sdk/sdk-3.1.2.js"></script>
<input id="song-link" placeholder="Paste Soundcloud link here" name="song_link" type="text">
<div id="putTheWidgetHere"></div>





Code helps me to preview the link of soundcloud. You can test its works fine. but i want to change its height from
400px
to
200px
. I have tried addding
addclass()
and
css()
. But it didnt work.

I couldnt figure which event will trigger these functions since the height must be set after the link is pasted on input text and loads on the
iframe
that soundcloud loads.

Answer

Try this:

#putTheWidgetHere iframe{
        min-height: 400px;
        height: auto;
}
Comments