mSyx
mSyx

Reputation: 19

Simple jQuery .hover not working

The following JS doesn't seem to be working. The class specified isn't adding to the element, no matter what I do, no matter where I put the JS.

$(document).ready(function(){
  $(".tuobb").hover(function(){
    $('#oinfosbb').addClass('oinfosbbho');
  }, function(){
    $('#oinfosbb').removeClass('oinfosbbho');
 });
});

http://twenty-two.forumactif.org/ » Bottom fixed element where it's written "En ligne ([..])"

Thanks in advance

EDIT

I have added the following code in one of my templates :

<div id="online_bb"></div>
<script type="text/javascript">jQuery.get('http://twenty-one.forumactif.com/portal',function(data){jQuery('#online_bb').html(jQuery(data).find('.onlinebb').html());});</script>

the 'get' doesn't go on the same forums but it does work (and I own both forums btw), but even if I put the Js code in any related template, it doesn't work.

Upvotes: 0

Views: 1055

Answers (3)

mSyx
mSyx

Reputation: 19

Problem solved, how stupid of me. The following code <script type="text/javascript">jQuery.get('http://twenty-one.forumactif.com/portal',function(data){jQuery('#online_bb').html(jQuery(data).find('.onlinebb').html());});</script> loads everything in .onlinebb.. and the JS code wasn't inside it. That was that simple.

Feel free to downvote me, I deserve it. o/

Upvotes: 0

Chris Cousins
Chris Cousins

Reputation: 1912

Where in your page are you including that JS? If possible, please reduce the issue into its smallest state, such as:

https://jsfiddle.net/mgentw5a/

$(document).ready(function() {
  $(".tuobb").hover(function() {
    $('#oinfosbb').addClass('oinfosbbho');
  }, function() {
    $('#oinfosbb').removeClass('oinfosbbho');
  });
});

In there, you can see there is nothing wrong with your JS (as long as you have the css rule applied also). In the source of your page there is some script run near to the elements in question that is doing some innerHTML replacement. Try removing that first to see if it helps you.

Upvotes: 1

user2345
user2345

Reputation: 3227

This code works perfectly, you just didn't specify any rules for .oinfosbbho in your CSS.

That might be why you think this is not working. In your console just add the rule and it should be working.

Upvotes: 1

Related Questions