SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Addict
    Join Date
    May 2008
    Location
    Missouri, USA
    Posts
    273
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    JQuery - Adding Hover Event to Hidden TD

    I have a script which loads tooltips on my webpage. The tooltips are embedded within a series of table cells. Initially some columns are visible and some are hidden. Columns which are visible by default work just fine. The problem is columns that are hidden by default are not loading the tooltip. Any ideas on how I can modify the following jquery call to get this to work?

    Code JavaScript:
    $('.show-tooltip-text').each().parent().hover(showTooltip, hideTooltip);

    Each cell has a span which is hidden by default with the class "show-tooltip-text". The purpose of this code is to add a hover event to the parent of this span which is the td element.

    Thanks, and let me know if I need to clarify anything.
    Follow Me On Twitter: BryceRay

  2. #2
    SitePoint Addict
    Join Date
    May 2008
    Location
    Missouri, USA
    Posts
    273
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by bar338 View Post
    I have a script which loads tooltips on my webpage. The tooltips are embedded within a series of table cells. Initially some columns are visible and some are hidden. Columns which are visible by default work just fine. The problem is columns that are hidden by default are not loading the tooltip. Any ideas on how I can modify the following jquery call to get this to work?

    Code JavaScript:
    $('.show-tooltip-text').each().parent().hover(showTooltip, hideTooltip);

    Each cell has a span which is hidden by default with the class "show-tooltip-text". The purpose of this code is to add a hover event to the parent of this span which is the td element.

    Thanks, and let me know if I need to clarify anything.

    I also tried this and it did not make a difference. Still unable to load tooltip for hidden td.
    Code JavaScript:
    	$('.show-tooltip-text').each(function(){
    		if($(this).parent().is(':visible')){
    			$(this).parent().hover(showTooltip, hideTooltip);
    		}else{
    			$(this).parent().show();
    			$(this).parent().hover(showTooltip, hideTooltip);
    			$(this).parent().hide();
    		}
    	});
    Follow Me On Twitter: BryceRay


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •