Click here to Skip to main content
13,054,779 members (64,969 online)
Rate this:
Please Sign up or sign in to vote.
See more:
I want to an j-query, which on bringing mouse at a place can show hidden text. it is their in the twitter.
Posted 27-Mar-12 21:29pm
Updated 28-Mar-12 7:57am
Rate this: bad
Please Sign up or sign in to vote.

Solution 2

With jQuery, this is really easy. One of the ways would be hiding by color.

Suppose you need to play this trick on some HTML element, such as div:
<div id="textHider"><!- some content... -></div>

Create some CSS style to hide the content, such as:
.hiddenText { background-color:yellow; color:yellow; }

myElement = $("#textHider");
className = "hiddenText";
myElement.addClass(className); //hide
    function() { //on mouse pointer getting in the element area
        $(this).removeClass(className); //show
    function() { //on mouse pointer going out
        $(this).addClass(className); //hide

You can use this idea to play with any properties defined in the styles, including visibility.

Please see:[^].

You can also control visibility of the whole element. Please see:[^],[^].


The last paragraph above, the one with two links, needs clarification. If you hide the same element on which you handle the mouse events, it won't work as you need, because after you hide it, it won't respond to mouse event. What I mean is: you need two nested elements. The outer element should respond to mouse events the way shown in the code above (it that example, this is the div element with id="textHider"). In the inner HTML of this element should be another one you would hide and show.

RaisKazi 28-Mar-12 20:53pm
My 5.
SAKryukov 28-Mar-12 21:09pm
Thank you, Rais.
ProEnggSoft 29-Mar-12 1:30am
Nice. +5
SAKryukov 29-Mar-12 10:51am
Thank you.
Monjurul Habib 30-Mar-12 4:53am
SAKryukov 30-Mar-12 11:16am
Thank you, Monjurul.
Rate this: bad
Please Sign up or sign in to vote.

Solution 1

Ok, so read the documentation[^]

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

Advertise | Privacy | Mobile
Web01 | 2.8.170713.1 | Last Updated 28 Mar 2012
Copyright © CodeProject, 1999-2017
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