實現頁面上點選小圖片,彈出大圖片的效果
阿新 • • 發佈:2019-02-18
<html><body> <a href="javascript:PassBet('images/products_1.jpg');"><img src="images/products_shouji_1.jpg" border="0"></a> </body> </html> <!--* 圖片層 開始 *--> <script> function PassBet(i) { oclose(); var p=100; var f = document.createElement('DIV'); f.style.textAlign = "center"; f.style.position = "absolute"; f.style.filter = "alpha(opacity="+p+")"; f.style.opacity = (p / 100); f.style.MozOpacity = (p / 100); f.style.KhtmlOpacity = (p / 100); f.style.width = 800; f.style.height = 600; f.style.margin = "0px"; f.style.backgroundColor = '#ffffff'; f.style.border="3px solid #cccccc"; f.style.padding="3px"; f.style.top=200; f.style.left=200; f.setAttribute('id','fdiv'); document.body.appendChild(f); document.getElementById('fdiv').innerHTML = "<a href=\"javascript:oclose();\"><img src="+i+" border=\"0\"></a>"; } function oclose() { if(document.getElementById('fdiv')) { document.body.removeChild(document.getElementById ('fdiv')); } } </script>
原文連結:http://blog.163.com/xyz_1112/blog/static/38694402200782784227513/