javascript - change src in iframe which depend on viewport size -


i'm quite new in website area

i'm trying change src in iframe src content table along width , height make not responsive

i'm trying change src depend on size of viewport

here code

<iframe width="100%" height="410" scrolling="yes" frameborder="0" scrolling="no" allowtransparency="true" src="http://tools.fxempire.com/sidebar-quotes.php?instruments=5,10,1,2,4,3&width=375&height=410&text_color=333&text_hover_color=082f60"></iframe>                                            <div id="fxempire_link" style="width:500px;font-size: 11px;">                                      free charts powered by <a rel="nofollow" style="text-decoration: underline;" target="_blank" href="http://www.fxempire.com">fxempire.com</a> - leading financial portal</div>   

i'm trying change following width inside src automatically

src="http://tools.fxempire.com/sidebar-quotes.php?instruments=5,10,1,2,4,3&width=375&height=410&text_color=333&text_hover_color=082f60" 

but don't idea it

is there way it??what found in internet using either link or button change src

well because of access-control-allow-origin can not ajax, php, dont know legal/illegal be.

by using iframe works way, sluggish cause iframe needs lot time load...:

$(window).bind('load resize',function(){     var windowh = $(window).height(),         windoww = $(window).width();      $('#iframe').attr('src','//tools.fxempire.com/sidebar-quotes.php?instruments=5,10,1,2,4,3&width='+windoww+'&height='+windowh+'&text_color=333&text_hover_color=082f60');     $('#iframe').css({'height':windowh+'px', 'width':windoww+'px'});     }) 

http://jsfiddle.net/ebjsd8xx/3/

edit: changed code little bit better performance but, - graph still loads freaking slow, it's same on preview..

var resizetimer;  $(window).load(function(){    $(window).trigger('resize'); });  $(window).resize(function(e){     var windowh = $(window).height(),         windoww = $(window).width();      cleartimeout(resizetimer);     resizetimer = settimeout(function() {        $('#iframe').attr('src','http://tools.fxempire.com/sidebar- quotes.php?instruments=5,10,1,2,4,3&width='+windoww+'&height='+windowh+'&text_color=333&text_hover_color=082f60');         $('#iframe').css({'height':windowh+'px', 'width':windoww+'px'});        }, 250);   }) 

http://jsfiddle.net/ebjsd8xx/7/


Comments

Popular posts from this blog

How to provide Authorization & Authentication using Asp.net, C#? -

toolbar - How to add link to user registration inside toobar in admin joomla 3 custom component -

How to use Authorization & Authentication in Asp.net, C#? -