Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: ASP.NET
Hi,
I want to make a label visible when the mouse is over atextbox and invisible the label on mouse out of the text box. How can I do it?
 
Thank you
Posted 28-Jun-12 1:50am
Zukiari1.5K
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

Try this
function LabelShow() {
var element = document.getElementById('<%=lbl.ClientID %>');
element.style.display = 'block';
}
function LabelHide() {
var element = document.getElementById('<%=lbl.ClientID %>');
element.style.display = 'none';
}
 
<asp:textbox id="txt" runat="server" onmouseover="LabelShow();" onmouseout="LabelHide();" xmlns:asp="#unknown"></asp:textbox>
<asp:label id="lbl" runat="server" text="text" xmlns:asp="#unknown">
</asp:label>
  Permalink  
Comments
Rahul Rajat Singh at 28-Jun-12 7:06am
   
+5 for trying out and then posting the answer.
pradiprenushe at 28-Jun-12 7:21am
   
Thanks
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

Please check the following code:
 
<script language="javascript" type="text/javascript">
    function onover()
    {
       // alert("over");
        document.getElementById('<%=Label1.ClientID%>').style.display="inline";
    }
    function onout()
    {
        //alert("out");
        document.getElementById('<%=Label1.ClientID%>').style.display="none";
    }
 
    </script>
 
<form id="form1" runat="server">
           <asp:Label ID="Label1" runat="server" Text="show"></asp:Label>
           <asp:TextBox ID="TextBox1" runat="server" onmouseover="javascript:onover();" onmouseout="javascript:onout();"></asp:TextBox>
   </form>
 

Working perfectly as per your requirement.
 
Please check and let me know.
 
mark it solution if you got your answer, so that other can refer the solution.
 
Thanks
Ashish
  Permalink  
v2
Comments
Rahul Rajat Singh at 28-Jun-12 7:06am
   
+5 for trying out and then posting the answer.
AshishChaudha at 28-Jun-12 7:09am
   
Thnx rahul
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

Tried to implement it and it seems to be working. here is the aspx markup for this:
 
<asp:TextBox ID="TextBox1" runat="server" onfocus="showLabel()" onblur="hidelabel()"
                onmouseover="showLabel()" onmouseout="hidelabel()">
 
            </asp:TextBox>
            <asp:Label ID="Label1" runat="server" Text="Label" Style="visibility: hidden;"></asp:Label>
 

and here is the JS function
 
function showLabel()
    {
        document.getElementById('Label1').style.visibility = "Visible";
    }
 
    function hidelabel()
    {
        document.getElementById('Label1').style.visibility = "hidden";
    }
  Permalink  
Comments
Zukiari at 28-Jun-12 7:45am
   
Thank you
Rahul Rajat Singh at 28-Jun-12 7:46am
   
you are most welcome. always happy to help fellow developers.
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 4

You have to use the Javascript onMouseOver and onMouseOut events for it.
<asp:textbox id="TextBox1" runat="server" onmouseover="showLabel()" onmouseout="hideLabel()" xmlns:asp="#unknown"></asp:textbox>
 
In the showLabel method display the label and in the hideLabel() method you can hide the label.
You can use the document.getElementById method to get the instance of the label object.
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 Maciej Los 474
1 ridoy 420
2 DamithSL 180
3 OriginalGriff 179
4 Richard MacCutchan 160
0 OriginalGriff 8,033
1 DamithSL 6,179
2 Sergey Alexandrovich Kryukov 5,538
3 Maciej Los 5,508
4 Kornfeld Eliyahu Peter 4,539


Advertise | Privacy | Mobile
Web04 | 2.8.141223.1 | Last Updated 28 Jun 2012
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100