折翼的天使
老师视频里的不同布局写法,不是习题!!不是习题!!!
<!doctype html> <html> <head> <meta charset="utf-8"> <title>折翼的天使</title> <style> input[type=button] { height: 32px; font-size: 100%; } </style> </head> <body> <img src="http://img1.sycdn.imooc.com//54447b06000171a002560191.jpg"> <img src="http://img1.sycdn.imooc.com//54447f4a0001eb7d01910256.jpg"> <img src="http://img1.sycdn.imooc.com//54447f550001ccb002560191.jpg"> <p><input type="button" id="button" value="点击第2张图片应用position:absolute变天使"></p> <script> var button = document.getElementById("button"), image2 = document.getElementsByTagName("img")[1]; if (button && image2) { var value_init = button.value; button.onclick = function() { if (this.value == value_init) { image2.style.position = "absolute"; this.value = "撤销"; } else { image2.style.position = ""; this.value = value_init; } }; } </script> </body> </html>