Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Sep 2004
    Posts
    96
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Problem with Jquery hover

    Hi,

    I'm trying to add a class to a <td> tag (which already has a class "description" on it) within a <tr> using JQuery when the user hovers over the <tr> tag. But my code doesn't seem to work. Please can you help? Here is my code:

    Code:
    $(document).ready(function(){
    $(
     function()
     {
      $("table.mytable tr").hover(
       function()
       {
        $(this).("td.description").addClass("highlight");
       },
       function()
       {
        $(this).("td.description").removeClass("highlight");
       }
      )
     }
    )
      });

  • #2
    New to the CF scene
    Join Date
    Feb 2008
    Location
    In your computer
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This should work:

    Code:
    $(document).ready(function(){
    
      $("table.mytable tr").hover(
       function()
       {
        $(this).("td.description").addClass("highlight");
       },
       function()
       {
        $(this).("td.description").removeClass("highlight");
       }
      )
      });
    You added an unnecessary "$({ })" while you already had "$(document).ready(function(){})" and both do exactly the same thing.

  • #3
    New Coder
    Join Date
    Sep 2004
    Posts
    96
    Thanks
    1
    Thanked 0 Times in 0 Posts
    thanks but this didn't work Its still not adding the class "highlight" to the "description" <td> tag, any ideas?

  • #4
    Senior Coder
    Join Date
    Feb 2003
    Posts
    1,665
    Thanks
    0
    Thanked 27 Times in 25 Posts
    e.g.
    Code:
    $(document).ready(function(){
    
    	$('table.mytable tr').hover(
    		function() {
    			$(this).find('td.description').addClass('highlight');
    		},
    		function() {
    			$(this).find('td.highlight').removeClass('highlight');
    		}
    	)
     });

  • #5
    New to the CF scene
    Join Date
    Feb 2008
    Location
    In your computer
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oups, forgot to add the "find" function names..

  • #6
    New Coder
    Join Date
    Feb 2007
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Dont you need to add a space? Else you are giving the cell a class of "descriptionhighlight" instead of "description highlight".

  • #7
    Regular Coder
    Join Date
    Feb 2009
    Location
    Wheeling, IL
    Posts
    358
    Thanks
    5
    Thanked 62 Times in 60 Posts
    Quote Originally Posted by wkdown View Post
    Dont you need to add a space? Else you are giving the cell a class of "descriptionhighlight" instead of "description highlight".
    Nope. jQuery does that automatically, so if you're adding more than one class, they're spaced out, without you needing to remember to put a space every time you use the addClass/removeClass function.
    The way to success is to assume that there are no impossible things. After all, if you think something is impossible, you will not even try to do it.

    How to ask smart questions?

  • #8
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts
    my is working now thank you!!!!


  •  

    Posting Permissions

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