javascript - jQuery - Change Iframe height in the onclick event of a button inside the iframe -
right working on simple html/jquery script want alter iframe height when i'm clicking on button loaded iframe self.
take @ code:
index.php:
<div id="outerdiv"> <iframe src="http://beta.sportsdirect.bg/test/iframe.php" id="inneriframe" scrolling="no" target="_parent"></iframe> </div> iframe.php:
<html> <head> <script src="//code.jquery.com/jquery-1.10.2.js"></script> </head> <script type="text/javascript"> $("#superwebf1").click(function(){ $('#inneriframe, #outerdiv', window.parent.document).css({"height":"450px"}); }) </script> <div style="display:block;height:300px;"> <h3>the iframe content</h3> <button type="button" id="superwebf1">click me resize holding iframe!</button> </div> here demo of index.php: http://beta.sportsdirect.bg/test/
when open you'll see button loaded iframe. when click button iframe not changing height!
why, there mistake?
can help me create thing work ?
thanks in advance!
here changes made code.
//function phone call needed create sure page loaded before javascript runs $(document).ready(function(){//begin document ready function //on click event $(document).on("click","#superwebf1",function(){//begin on click event //change height of selected elements $('#inneriframe, #outerdiv', window.parent.document).css({"height":"450px"}); });//end on click event });//end document ready function javascript jquery html button iframe
No comments:
Post a Comment