Apologies in advance for my poor English skills, but I have been contemplating whether to write here and if you will be able to understand me.
I am currently working on a jQuery script:
$(function() {
$('#div1').hover(function() {
$('#div1').css('display', 'block');
}, function() {
$('#div2').css('display', 'none');
});
});
The purpose of this script is illustrated here: https://i.sstatic.net/RW7Lp.png
It functions as intended, except when the cursor moves away from the "Home Page" link, the second DIV disappears :(
Is there a way to achieve something like this:
$(function() {
$('#div1' + '#div2').hover(function() {
$('#div1').css('display', 'block');
}, function() {
$('#div2').css('display', 'none');
});
});
I don't have much experience with jQuery and would appreciate some guidance.
Your help is greatly appreciated, I hope I have made myself clear.
In summary... When hovering over Div1 or Div2, both should display Div2 :P
I attempted to create a simple sliding menu, but due to the site structure being entirely composed of Divs, I had to incorporate additional Divs for the menu (as seen in the image).
This menu panel is located on my Tumblr page, where you can view it at : idolwszutrab7.tumblr.com. Please note that I have not updated the page with this script yet.
Update:
I have copied everything to:
http://jsfiddle.net/IdolwSzutrab7/Wq3YH/
I have tested it and it works on this site :)