[jQuery] Mouseover will make a div appear/dissappear
Hello! I am creating a new script where an image have areas where when
you place your move over a part of that image, a div will appear at
the bottom, and when you click on another area, the current visible
div will be hidden and a new div that has other text will appear.
Here's my code:
$(document).ready(function(){
test1();
test2();
});
function test1(){
$('#CFnum1').mouseover(function() {
$('#comfort_flex_hold').find('#comfort_flex01').show("slow");
$
('#comfort_flex_hold').find('div').not('#comfort_flex01').hide("slow");
return false;
});
}
function test2(){
$('#CFnum2').mouseover(function() {
$('#comfort_flex_hold').find('#comfort_flex02').show("slow");
$
('#comfort_flex_hold').find('div').not('#comfort_flex02').hide("slow");
return false;
});
}
It's a newbie code, I know and not a very good one indeed. As you can
see, if I have more than 15 areas, i'll have to create a code of each
area! I know there is a better way to create the same effect with
lesser codes but I don't know how jQuery works completely.
I thought this would work:
$(document).ready(function(){
test1();
});
function test1(imgID,number){
$(imgID).mouseover(function() {
$('#comfort_flex_hold').find('#comfort_flex1').show("slow");
$
('#comfort_flex_hold').find('div').not('#comfort_flex1').hide("slow");
return false;
});
}
whereas the image has:
../images/mattress/numbers/BSnum1.gif
I stump. Could you guys please help me out? Thanks in advance! :)
--
View this message in context: http://www.nabble.com/Mouseover-will-make-a-div-appear-dissappear-tp16201073s27240p16201073.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.