compatibility problems with javascript

[danielastorga]

I want to make a customization with jquery.
I have already customized other parts of my site with jquery and everything is going well.
I want to move the mouse over any of the search results and I would like something like this:
see attached fig.1.

I know that the support does not include customizations.
however, I think there is a conflict when I try to add a simple event like the example:

$(“.overlap”).mouseover(function(){

$(this).css(“background-color”,”red”);

});

This code is included in a js file duly registered in wordpress.
I do not know what may be happening.
Can you help me?
Thank you

[Ernest Marcinko]

Hi,

The issue is, that the ajax results are considered as dynamically generated/inserted elements on the DOM node tree. Your code however will only work with items, that are present at the page load. You need a dynamic event binding function.

To correctly attach a handler, you need to use the jQuery.fn.on(..) function. In your case, something like this:

If I may recommend an alternative solution. Changing colors is much simpler by using custom CSS. In your case:

[html].asp_r .overlap:hover {
background-color: red;
}[/html]

That is much simpler in my opinion 🙂

[Author]

Posts