html - Create an iframe dynamically -
i want create iframe dynamically on button click , want load side side. coming 1 under other.
please help
here code.
<!doctype html> <html> <style> .box{ width:100%; float:left; } </style> <div class="box"> <iframe width="100%" scrolling="yes" height="630" src="window.html"> </iframe> </div> <div class="box"> <iframe width="100%" scrolling="yes" height="630" src="window.html"> </iframe> </div> </html> and window.html is:
<!doctype html> <html> <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script> <script type="text/javascript"> $(document).ready(function(e) { $('#apdiv2').click(function(e) { alert('sdf'); }); }); </script> <head> <style type="text/css"> #apdiv1 { position: absolute; width: 933px; height: 115px; z-index: 1; left: 94px; top: 138px; } #apdiv3 { position: absolute; width: 56px; height: 54px; z-index: 1; left: 1174px; top: -117px; } #apdiv2 { position: absolute; width: 54px; height: 52px; z-index: 2; left: 1267px; top: 422px; } #apdiv4 { position: absolute; width: 77px; height: 76px; z-index: 3; left: 1019px; top: 412px; } #apdiv5 { position: absolute; width: 558px; height: 50px; z-index: 4; left: 153px; top: 413px; } </head> <body> <div id="apdiv5"> <label for="textfield"></label> <input type="text" name="textfield" id="addr" size="100" placeholder="enter url here"> </div> <div id="apdiv1"> <div id="apdiv3"><img src="close.png" width="50" height="50"></div> <p>on closs button</p> </div> <div id="apdiv2" ><img src="add.png" width="50" height="50"></div> <div id="apdiv4" style="display:none"><img src="pull.png" width="50" height="51"> pull</div> </body> </html> actually want load new iframe on side of first iframe
define widths, , after utilize float align them on own sides.
otherwise, div block level element. take entire line. should set widths 50% , align them infront of each other.
html css iframe
No comments:
Post a Comment