用图片代替Radio选择value值发表日期:2011-10-28 文章来源:本站 浏览: 次
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>留言板头像选择代码-商艺网络</title> <style type="text/css"> .on{margin:5px;border:1px solid #F60;filter:alpha(Opacity=100)} .off{margin:5px;border:1px solid #CCC;filter:alpha(Opacity=20)} </style> </head> <body> <script language="javascript"> function aa(a, b, c) { document.form1.img.value = a; document.getElementById("touxiang").getElementsByTagName("img")[a - 1].className = "on"; document.getElementById("touxiang").getElementsByTagName("img")[b - 1].className = "off"; document.getElementById("touxiang").getElementsByTagName("img")[c - 1].className = "off"; } function Check(x) { for (i = 1; i <= 1; i++) document.all.img.value = x } </script> <div id="touxiang"> <a href="#"><img border="0" src="http://www.lanrentuku.com/down/js/images/12625057550.gif" name=01 onclick=aa(1,2,3,4);Check(this.name,"") class="off"></a> <a href="#"><img border="0" src="http://www.lanrentuku.com/down/js/images/12625057551.gif" name=02 onclick=aa(2,1,3,4);Check(this.name,"") class="off"></a> <a href="#"><img border="0" src="http://www.lanrentuku.com/down/js/images/12625057552.gif" name=03 onclick=aa(3,1,2,4);Check(this.name,"") class="off"></a> <form name="form1"> <input type=text name=img value="01"> </form> <p>用图片代替Radio框选择value值,效果还不错,可以用作留言板图像选择按钮。</p> <p>filter滤镜在Firefox下无效,但border起作用~</p> <p>演示:<a target="_blank" href="http://www.xw62.com/plus/guestbook.php">http://www.xw62.com/plus/guestbook.php</a></p> <p>作者:<a href="http://www.xw62.com/" target="_blank">西西</a></p> 尊重他人劳动,转载请保留出处! <p>查找更多代码,请访问:<a href="http://www.xw62.com/" target="_blank">商艺网络</a></p> </body> </html> |