Question

I want to have a different hover effects on each div using the div id. Is it possible? I have been searching on google for a while now and all I see is hover effect using classname and tags. I want to do this using javascript or jquery. Any help is appreciated, Thanks!

Answer 1

You could evaluate the id from within the functions:

$(".hoverItems").hover( overState, outState );

function overState () {
  switch ( this.id ) {
    case "foo" :
      /* effect a */
      break;
    case "bar" :
      /* effect b */
  }
}

function outState () {
  switch ( this.id ) {
    case "foo" :
      /* undo effect a */
      break;
    case "bar" :
      /* undo effect b */
  }
}

Demo: http://jsbin.com/evikog/edit#javascript,html