framese 与跳出frameset

大小可调整和不可调整的框架代码来自w3school 


Java代码  收藏代码
  1. <html>  
  2. <frameset cols="50%,50%">  
  3.   <frame id="leftFrame" src="/example/hdom/frame_noresize.html">  
  4.   <frame id="rightFrame" src="/example/hdom/frame_a.html">  
  5. </frameset>  
  6. </html>  




带滚动条和不带滚动条的框架代码


Java代码  收藏代码
  1. <html>  
  2. <frameset cols="50%,50%">  
  3.   <frame id="leftFrame" src="/example/hdom/frame_scroll.html">  
  4.   <frame id="rightFrame" src="/example/hdom/frame_a.html">  
  5. </frameset>  
  6. </html>  



跳出框架代码


Java代码  收藏代码
  1. <html>  
  2. <head>  
  3. <script type="text/javascript">  
  4. function breakout()  
  5.   {  
  6.   if (window.top!=window.self)   
  7.     {  
  8.     window.top.location="/example/hdom/tryjs_breakout.htm"  
  9.     }  
  10.   }  
  11. </script>  
  12. </head>  
  13. <body>  
  14. <input type="button" onclick="breakout()" value="跳出框架！">  
  15. </body>  
  16. </html>  

也可以用超链接跳出frameset

<a onclick="if (confirm('确定要退出吗？')) return true; else return false;" target=_top href="http://localhost:8080/D_Ning_App/" >退出</a>



更改两个框架的员代码

Java代码  收藏代码
  1. <html>  
  2. <head>  
  3. <script type="text/javascript">  
  4. function changeSource()  
  5. {  
  6. document.getElementById("frame1").src="/example/hdom/frame_c.html"  
  7. document.getElementById("frame2").src="/example/hdom/frame_d.html"  
  8. }  
  9. </script>  
  10. </head>  
  11.   
  12. <body>  
  13. <iframe src="/example/hdom/frame_a.html" id="frame1"></iframe>  
  14. <iframe src="/example/hdom/frame_b.html" id="frame2"></iframe>  
  15. <br /><br />  
  16. <input type="button" onclick="changeSource()" value="改变两个框架的 source">  
  17.   
  18. </body>  
  19. </html>  



image 对象 


改变图像的大小代码


Java代码  收藏代码
  1. <html>  
  2. <head>  
  3. <script type="text/javascript">  
  4. function changeSize()  
  5. {  
  6. document.getElementById("compman").height="270"  
  7. document.getElementById("compman").width="164"  
  8. }  
  9. </script>  
  10. </head>  
  11.   
  12. <body>  
  13. <img id="compman" src="/i/eg_bulbon.gif" />  
  14. <br /><br />  
  15. <input type="button" onclick="changeSize()" value="改变图像的高度和宽度">  
  16. </body>  
  17.   
  18. </html>  



改变图像的src代码

Java代码  收藏代码
    1. <html>  
    2. <head>  
    3. <script type="text/javascript">  
    4. function changeSrc()  
    5.   {  
    6.   document.getElementById("myImage").src="/i/eg_smile.gif"  
    7.   }  
    8. </script>  
    9. </head>  
    10.   
    11. <body>  
    12. <img id="myImage" src="/i/eg_bulbon.gif" />  
    13. <br /><br />  
    14. <input type="button" onclick="changeSrc()" value="改变图像">  
    15. </body>  
    16.   
    17. </html> 
posted @ 2016-09-01 16:08  猴子1  阅读(139)  评论(0)  编辑  收藏  举报