javascript - how to increase iframe width on onclick of image.? -


i getting troubled when click on show/hide image div_20 hide & width of iframe increased space of div_20 blank space & iframe width increased in horizontal. please give me guidance related problem.

i have tried following jquery code show/hide left menus.

$('#mainmenu').toggle(    function()    {      $('#ifrm').css("width", '100%')      $('#div_20').css("width", '5%')      $('#ifrm').css("margin-left", '0')    }, function() {      $('#ifrm').css("width", '83.5%')      $('#div_20').css("width", '17%')      $('#ifrm').css("margin-left", '0%')    });
   <div  id="mainmenu">       <a>           <i class="fa fa-align-justify"></i>      </a>      </div>     <div  id="div_20">      //list of menus        </div>       <iframe id="ifrm" src="dashboard.php" name="ifrm2" scrolling="yes"></iframe>

if can specify lies within #div_20 help, thus:

<div id="mainmenu">     <a><i class="fa fa-align-justify"></i></a>  </div> <div id="div_20">     <ul>       <li>menu1</li>       <li>menu1</li>       <li>menu1</li>       <li>menu1</li>       <li>menu1</li>    </ul> </div> <iframe id="ifrm" src="dashboard.php" name="ifrm2" scrolling="yes"></iframe> 

you can use following jquery code

var newwidth; $('#ifrm').css({ marginleft: 0 }); $('#div_20').height(100);        $('#mainmenu > a').on('click', function() {     $('#div_20 > ul').toggle();     newwidth = $('#ifrm').width()+10;     $('#ifrm').width(newwidth);     $('#ifrm').css({ marginleft: 0 }); }); 

Comments

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

javascript - Function overwritting -

php - Find a regex to take part of Email -