Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Why is the jQuery hover class not working?

I have no clue why this is not working.

statuses.css.scss // Place all the styles related to the statuses controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/

.status {
  border-bottom: solid 1px #CCCCCC;
  padding: 5px 0;
}

.status p {
  margin: 4px 0;
}

.status.hover {
  background: #FAFAFA;
}

.status .admin {
  display: none;
}

.status.hover .admin {
  display: inline;
}

statuses.js.coffee # Place all the behaviors and hooks related to the matching controller here. # All this logic will automatically be available in application.js. # You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/

$ ->
    $('.status').hover(event) ->
        $(this).toggleClass("hover")

2 Answers

Tim Knight
Tim Knight
28,888 Points

Hi Domnick, I know this doesn't answer your core question, but why are you adding a hover state through JS? Since about IE7 you've been able to address :hover on any div using a CSS selector.

Instead of calling status.hover just use status:hover and remove this specific part of you CoffeeScript. Again I know that doesn't meet you question, but personally I feel the job you're trying to accomplish is better served with CSS.

Thank you Sir!

im not very well in coffescript but i see you have many spaces i validate the code and it give a error the right coffescript code is this

$ ->
  $('.status').hover(event) ->
    $(this).toggleClass("hover")

this is the validator i use: http://www.coffeelint.org/

sorry me english is bad i speak spanish :P

It did fix the indentation issues however, it is still not working also don't worry about it.