Heim > Web-Frontend > HTML-Tutorial > 很简单的问题,帮忙解决一下,谢谢。_html/css_WEB-ITnose

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

WBOY
Freigeben: 2016-06-24 12:15:52
Original
897 Leute haben es durchsucht

我想用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>
Nach dem Login kopieren



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

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

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage