mouseover, mouseout, applies to all items

Question

mouseover, mouseout, applies to all items

Navigation

#1 by (2 votes)
#2 by (0 votes)
#3 by (0 votes)

0

I'm doing mouseover and mouseout to some images that have the same class. I want to put a visibility: hidden and visibility: visible . The code that I leave does but it applies to all the elements at the same time.

How do I apply it to each individual element or in itself?

Thank you.

$(".vc_clearfix", this).mouseover(function(){
    		$('.vc_gitem-zone-img').css("visibility", "hidden");
		  	});
			$(".vc_clearfix", this).mouseout(function(){
		    $('.vc_gitem-zone-img').css("visibility", "visible");
		 	});

jquery imagen

asked by Sixto Mujica 11.07.2017 в 00:41

source

3 answers

Why does not OnClick work on my td? [closed] ORDER BY in PHP that does not ORDER nothing at all

score 2 · Answer 1

Assuming that the class in common is vc_clearfix, you would only have to indicate the child of the element on which you pass the mouse (vc_clearfix) by means of the class for example.

$(".vc_clearfix", this).mouseover(function(){
    $(this).children('.vc_gitem-zone-img').css("visibility", "hidden");
});
$(".vc_clearfix", this).mouseout(function(){
    $(this).children('.vc_gitem-zone-img').css("visibility", "visible");
});

score 0 · Answer 2

You can add a specific class for the elements you want and add it to the jquery selector that you are using.

Basic example of jQuery selectors:

$('#ID.vc_clearfix')

With # you would search for the ID of the element

$('.vc_clearfix.otra_clase')

You can also concatenate the classes to be more specific, or add your class to the elements you want to modify.

$('div.vc_clearfix')

In this case all the DIV with the class .vc_clearfix will be executed the method you mention.

Here is information and it is in Spanish with which you can support: jQuery Selectors

score 0 · Answer 3

You can use an identifier and then only affect the images of that ID

$("#ID").mouseover(function(){
    $(this).find('img').css("visibility", "hidden");
});

$("#ID").mouseout(function(){
    $(this).find('img').css("visibility", "visible");
});