Question about show/hide DIV
Hi all..
I have a code that allows me to show/hide a DIV and works great.. However I'm completely clueless as to how I would have multiple links. I'll explain a bit better.
Basically, I want link 1 to show/hide DIV 1, then link 2 to show/hide DIV 2 in the exact same part of the page, and so on with DIV 3, 4, 5 etc.
Also, when DIV 2 is clicked, I would need DIV 1 to close with the same effect it would have if I clicked its own hide button, then DIV 2 to open once DIV 1 had finished closing, does this make sense?
I'm not sure if I'm trying to do something way out of my league here, however jquery is something i HAVE to learn, it's amazing!
Here's my code so far:
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
$('ul.nav a').bind('click',function(event){
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 1500,'easeInOutExpo');
event.preventDefault();
});
});
$('html').css('overflow','hidden');
</script>
And here's the HTML for the link:
- <a onclick="ShowHide(); return false;" href="#"><img id="imgpad" src="images/known.gif" /></a>
I would be extremely grateful for any help anyone can give me!!!
Thankyou!