如何在鼠标悬停时更改图像 [英] how to change a image on mouseover

问题描述

hii

我的aspx页面上有一个图像按钮，我想在鼠标悬停事件上更改此图像。我无法找到asp的智能鼠标：ImageButton。

我怎么能这样做..

i试过...

< script language =   javascript type =   text / javascript> 
  function  mouseOverImage（）{
  document  .getElementById（  ImageButton1）。src =  图像/橙圆按钮th.png ; 
} 
 
  function  mouseOutImage（）{
  document  .getElementById（  ImageButton1）。src =    images / blue.png; 
} 
< / script> 
 

 <   asp：ImageButton     ID   =   ImageButton1    runat   =  server   高度  =  55px         < span class =code-attribute>                     ImageUrl   = 〜/ images / blue.png < span class =code-attribute>     onmouseover   =  mouseOverImage（）      onmouseout   =  mouseOutImage（）    /  >  

如果我把idimg放在javascript

 <   img       id   =  img    alt   =  image   高度  =  55px      src   =  images / blue.png    onmouseover     =  mouseOverImage（）     önmouseout  =  mouseOutImage（）  /  >  

解决方案

  function  mouseOverImage（）{
  document  .getElementById（' <％= ImageButton1.ClientID％>'）。src =  图像/橙圆按钮th.png ; 
} 
 
  function  mouseOutImage（）{
  document  .getElementById（' <％= ImageButton1.ClientID％>'）。src =   images / blue.png; 
} 

或者你可以使用

 <   asp：ImageButton     ID   =  ImageButton1    runat   =  server    
   
                                     ImageUrl   = 〜/ images / blue.png  
   
                                     onmouseover   =  this.src ='images / orange-round-button-th.png'; < span class =code-attribute> 
   
    < span class =code-attribute>                                 onmous eout   =  this.src ='images / blue.png';  
   
                                       /  >  

aspx文件

 <   asp：imagebutton     id   =  imgBtn1    runat   = 服务器    imageurl   =  〜/ images / 1.gif    borderwidth   =  0    xmlns：asp   = ＃unknown >  <   / asp：imagebutton  >  

// onpage load为它们分配属性。

.aspx.cs

  protected   void  Page_Load（ object  sender，EventArgs e）
 {
 imgBtn1.Attributes.Add（   onmouseover，  this.src = '图像/ 3.gif'）; 
 imgBtn1.Attributes.Add（  onmouseout，  this.src ='images / 4.gif'）; 
} 

请参阅：在鼠标上更改图片

hii
i have a imagebutton on my aspx page and i want to change this image on mouse over event. i m unable to find mouseover intelligence for asp:ImageButton.
how can i do this..
i have tried...

<script language="javascript" type="text/javascript">
       function mouseOverImage() {
           document.getElementById("ImageButton1").src = "images/orange-round-button-th.png";
       }

       function mouseOutImage() {
           document.getElementById("ImageButton1").src = "images/blue.png";
       }
   </script>

<asp:ImageButton ID="ImageButton1" runat="server" Height="55px"              ImageUrl="~/images/blue.png"  onmouseover="mouseOverImage()"  onmouseout="mouseOutImage()" />

it works fine for html imagecontrol if i put id "img" in javascript

<img  id= "img" alt="image " Height="55px"  src="images/blue.png" onmouseover = "mouseOverImage()"  önmouseout="mouseOutImage()"/> 

解决方案

function mouseOverImage() {
            document.getElementById('<%= ImageButton1.ClientID %>').src = "images/orange-round-button-th.png";
        }
 
        function mouseOutImage() {
            document.getElementById('<%= ImageButton1.ClientID %>').src = "images/blue.png";
        }

Or you can use

<asp:ImageButton ID="ImageButton1" runat="server" 

                 ImageUrl="~/images/blue.png"

                 onmouseover="this.src='images/orange-round-button-th.png';"

                 onmouseout="this.src='images/blue.png';"

                  />

aspx file

<asp:imagebutton id="imgBtn1" runat="server" imageurl="~/images/1.gif" borderwidth="0" xmlns:asp="#unknown"></asp:imagebutton>

//onpage load assign them attributes.
.aspx.cs

protected void Page_Load(object sender, EventArgs e)
{
imgBtn1.Attributes.Add("onmouseover", "this.src='images/3.gif'");
imgBtn1.Attributes.Add("onmouseout", "this.src='images/4.gif'");
}

see this:Change image on mouse over

这篇关于如何在鼠标悬停时更改图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！