I have a dropdown menu with 4 menu categories. One, Two, Three & Four. Each category have a negative z-index command.
One (z-index-1) Two (z-index-2) Three (z-index-2) Four (z-index-2)
That way, zindex-1 is always in front (ΟΝΕ).
If I press menu Two, I want it to become z-index -1 and the rest to change automatically to -2 etc. i.e
One (z-index-2) Two (z-index-1) Three (z-index-2) Four (z-index-2)
I wonder , is there a better way to write this code? Thanks
$('.one').css({
'position': 'absolute',
'z-index': '-1'
});
$('.two').css({
'position': 'absolute',
'z-index': '-2'
});
$('.three').css({
'position': 'absolute',
'z-index': '-2'
});
$('.four').css({
'position': 'absolute',
'z-index': '-2'
});
for starters -
$('.one,.two,.three,.four').click(function() {
$('.one,.two,.three,.four').css({position: 'absolute', 'z-index': '-2'});
$(this).css('z-index', '-1');
})
But if you added your html, and actual purpose in doing that, I believe the answer will be much different.