Hover script not working

if($('#this_id').lenght>0 && $('.bar').hover()){
   $('.co').css({"display":"block","left":"600px", "z-index", "999999"});
}

Hello all, the script above seems correct to me. But it isn’t working. the “co” element remains as display: none.
Is there something really obvious I am missing.
Thx

1 Like

How about

if($('#this_id').length>0) {
  $('.bar').hover(function () {
    $('.co').css({"display":"block","left":"600px", "z-index", "999999"});
  });
}

This way, if #this_id exists and the element with class .bar is hovered, we add style to .co.

I’m not sure $('.bar').hover(); returns a boolean to be used as a condition, but I guess it does not.

Also, it’s recommend that a class is created with those CSS properties and instead of using the .css method, use addClass. So in the stylesheet:

.new_class {
  display: block;
  left: 600px;
  z-index: 999999;
}

And in Javascript:

if($('#this_id').length>0) {
  $('.bar').hover(function () {
    $('.co').addClass('new_class');
  });
}

This is best practice because it doesn’t add inline style to the elements. :smile:

1 Like

Yep i know about the css. Am at the early figure it out stages hence the css is still there.
However thank you, and i think i reached a similar conclusion w/the jquery
having the && there made no sense, js wise.

if($('#this_id').lenght>0){
     $('.bar').hover(function() {
     $( '.calloutAbsolute' ).fadeIn( 500 ).css({"display":"block"});
  });

Also, there’s a small typo there. It should be length. Otherwise, you are good to go! :ok_hand: :smile:

1 Like

Dang…no face palm icon! thx Mateus!

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.