Return to Snippet

Revision: 62863
at September 6, 2013 11:47 by leodruker


Updated Code
<script type="text/javascript">

$.noConflict();
function adjustIframes()
{
  $('iframe').each(function(){
    var
    $this       = $(this),
    proportion  = $this.data( 'proportion' ),
    w           = $this.attr('width'),
    actual_w    = $this.width();
    if ( ! proportion )
    {
        proportion = $this.attr('height') / w;
        $this.data( 'proportion', proportion );
    }
    if ( actual_w != w )
    {
        var h =  Math.round( actual_w * proportion );
        
        if (!isNaN(h)) {
            if (console && console.log) console.log("Resizing iframe to height: " + h);
            $this.css( 'height', h + 'px' );
            
            if ($this.get(0).contentWindow.postMessage) {
                $this.get(0).contentWindow.postMessage('resize', 'your website here');
            }   
        }
    }
  });
}
$(window).on('resize load',adjustIframes);	
});
</script>

Revision: 62862
at March 19, 2013 08:54 by leodruker


Updated Code
<script type="text/javascript">

$.noConflict();
jQuery(document).ready(function($) {

function adjustIframes()
{
  $('iframe').each(function(){
    var
    $this       = $(this),
    proportion  = $this.data( 'proportion' ),
    w           = $this.attr('width'),
    actual_w    = $this.width();
    
    if ( ! proportion )
    {
        proportion = $this.attr('height') / w;
        $this.data( 'proportion', proportion );
    }
  
    if ( actual_w != w )
    {
        var h =  Math.round( actual_w * proportion );
        
        if (!isNaN(h)) {
            if (console && console.log) console.log("Resizing iframe to height: " + h);
            $this.css( 'height', h + 'px' );
            
            if ($this.get(0).contentWindow.postMessage) {
                $this.get(0).contentWindow.postMessage('resize', 'YOUR WEBSITE HERE');
            }   
        }
    }
  });
}
$(window).on('resize load',adjustIframes);
		
});
</script>

Revision: 62861
at March 19, 2013 07:33 by leodruker


Updated Code
$.noConflict();
jQuery(document).ready(function($) {

function adjustIframes()
{
  $('iframe').each(function(){
    var
    $this       = $(this),
    proportion  = $this.data( 'proportion' ),
    w           = $this.attr('width'),
    actual_w    = $this.width();
    
    if ( ! proportion )
    {
        proportion = $this.attr('height') / w;
        $this.data( 'proportion', proportion );
    }
  
    if ( actual_w != w )
    {
        var h =  Math.round( actual_w * proportion );
        
        if (!isNaN(h)) {
            if (console && console.log) console.log("Resizing iframe to height: " + h);
            $this.css( 'height', h + 'px' );
            
            if ($this.get(0).contentWindow.postMessage) {
                $this.get(0).contentWindow.postMessage('resize', 'YOUR WEBSITE HERE');
            }   
        }
    }
  });
}
$(window).on('resize load',adjustIframes);
		
});

Revision: 62860
at March 19, 2013 04:38 by leodruker


Initial Code
function adjustIframes()
{
  $('iframe').each(function(){
    var
    $this       = $(this),
    proportion  = $this.data( 'proportion' ),
    w           = $this.attr('width'),
    actual_w    = $this.width();
    
    if ( ! proportion )
    {
        proportion = $this.attr('height') / w;
        $this.data( 'proportion', proportion );
    }
  
    if ( actual_w != w )
    {
        var h =  Math.round( actual_w * proportion );
        
        if (!isNaN(h)) {
            if (console && console.log) console.log("Resizing iframe to height: " + h);
            $this.css( 'height', h + 'px' );
            
            if ($this.get(0).contentWindow.postMessage) {
                $this.get(0).contentWindow.postMessage('resize', 'http://leodruker.com');
            }   
        }
    }
  });
}
$(window).on('resize load',adjustIframes);
		
});

Initial URL
javascript, jquery, iframe

Initial Description
JavaScript code to facilitate dynamic re-sizing of an iframe at the same time as the browser window is re-sized, as well as making sure that the frame scales proportionally to its width and height.

Initial Title
iframe dynamic resize

Initial Tags
php, resize

Initial Language
JavaScript