Rumah > hujung hadapan web > html tutorial > 很简单的问题,帮忙解决一下,谢谢。_html/css_WEB-ITnose

很简单的问题,帮忙解决一下,谢谢。_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 12:15:52
asal
924 orang telah melayarinya

我想用CSS来设置一个button的背景:
即:正常不点击的时候背景是图片1.png,点击后(即:选中状态时)背景图片是2.png。
有没有好的解决方法,谢谢。
网上查到一个是这样解决的:
<script> <br /> var Arr=new Array( "1.jpg ", "2.jpg ") <br /> var i=0 <br /> function fun(){ <br /> aa.style.backgroundImage= "url( "+Arr[i]+ ") " <br /> i=i+1 <br /> if(i> =2)i=0 <br /> } <br /> </script> 

 
   
 
aaaa 
 

回复讨论(解决方案)

用div 不要用button

演示效果: http://job.dingso.com/crm/mail.php 我写的一个按钮的样式





<script> <br /> $(document).ready(function(){ <br /> $('#button').mouseover(function(){ <br /> $(this).removeClass('btn'); <br /> $(this).removeClass('btdown'); <br /> $(this).addClass('bton'); <br /> }); <br /> $('#button').mouseout(function(){ <br /> $(this).removeClass('bton'); <br /> $(this).addClass('btn'); <br /> }); <br /> $('#button').mousedown(function(){ <br /> $(this).addClass('btdown'); <br /> }); <br /> $('#button').mouseup(function(){ <br /> $(this).removeClass('btdown'); <br /> $(this).addClass('btn'); <br /> }); <br /> </script>

对啊,用DIV,而且这个根本不需要JS来控制,直接CSS就可以写出来www.seo7ye.com

对啊,用DIV,而且这个根本不需要JS来控制,直接CSS就可以写出来www.seo7ye.com
求指教:
不用js控制怎么写啊?



两个 class   bg1 bg2 该怎么定义 不用我教了吧

首先指出几个错误,楼主的代码里面有很多不必要的空格,例如id= "aa "、i> =2等,这个是导致程序无法运行的一个原因,另外,aa.style.backgroundImage,其中aa没有定义,其他没什么大问题,我把详细的代码贴在下面了,在相同文件夹下放两张图片就可以运行了

<!DOCTYPE html><html><head><script>  var Arr=new Array( "1.jpg", "2.jpg")  var i=0 ;function fun(){   var aa=document.getElementById("aa");   aa.style.background="url("+Arr[i]+ ")";   i=i+1;    if(i>=2)     i=0;}</script>  </head><body><table width=500 height=100 id= "aa" background="1.jpg" >  <tr> <td>  aaaa  </td> </tr>  </table>  <input type="submit" value="Button" id="bb" onClick="fun();"/></body></html>
Salin selepas log masuk



两个 class   bg1 bg2 该怎么定义 不用我教了吧

谢谢啊,是啊,这中方法比较好。

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan