首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

鼠标透过图片时变成另外一张

2013-01-28 
鼠标经过图片时变成另外一张想实现鼠标经过图片时显示另外一张图片,鼠标离去后显示另一张图片,如下代码he

鼠标经过图片时变成另外一张
想实现鼠标经过图片时显示另外一张图片,鼠标离去后显示另一张图片,
如下代码


<head runat="server">

    <title>无标题页</title>    

   <style>
      .sy{background-image:url(Image/menusy.jpg);}

      .sy1{background-image:url(Image/menuOnSY.jpg);}

      .zj{background-image:url(Image/menuGSGK.jpg);}

      .zj1{background-image:url(Image/menuOnGSGK.jpg);}

      .xw{background-image:url(Image/menuNews.jpg);}

      .xw1{background-image:url(Image/menuOnNews.jpg);}

      .cp{background-image:url(Image/menuCPZS.jpg);}

      .cp1{background-image:url(Image/menuOnCPZS.jpg);}

      .zs{background-image:url(Image/menuJSZR.jpg);}

      .zs1{background-image:url(Image/menuOnJSZR.jpg);}

 

      .rc{background-image:url(Image/menuGYKF.jpg);}

      .rc1{background-image:url(Image/menuOnGYKF.jpg);}


      .lx{background-image:url(Image/menuZLXZ.jpg);}

      .lx1{background-image:url(Image/menuOnZLXZ.jpg);}
  

   </style>

  
</head>

<body>

    <form id="form1" runat="server">

    <div>     

       <ul>

            <li style="width:113px; height:30px;
background-image:url(Image/menuGSGK.jpg); list-style-type:none; "
onmouseup="this.className='zj'" onmouseout="this.className='zj1'"> 

            </li>

        </ul>

    </div>

    </form>

</body>

</html>




高手看看那儿错了,实现不了,鼠标经过时没有反应
[解决办法]
onmouseover
[解决办法]
引用:
onmouseover

+++
[解决办法]
写一个方法,然后在onmouseover里面调用~~
[解决办法]
把这个 去掉 background-image: url(Image/menuGSGK.jpg);

也换成  用 class表示的 。原因是 background-image: url(Image/menuGSGK.jpg); 是 行内样式,级别最高 ,回覆盖其他设定

热点排行