Public Voice Network
- How much % of visitors to… 2626
- logo crit 4545
- that jquery, 3636
- my identity is loading... 33
- Wanda Sykes munches rug 1212
- Baby P's Parents/Kill… 5555
- Vid of the Day 492492
- Folio Crit 238238
- Your Christmas List 2424
- Secret Santa Gift Ideas 1313
- Looking for Flash tutoria… 44
- Arrested Development Movi… 3232
- New XBox Live 4646
- Pic of the Day 1017410174
- EC: Quarter Pounder 77
- blog 3025230252
- Jaline 103103
- Chick of the Day 16001600
- Portfolio online 1616
- Free Style 2424
- FMT 112108 2727
- Florida people 3131
- EC: Joe Wigdahl 2222
- Help me. 3636
jQuery + anchor based accordion 44 Responses
Last post: 2 months, 2 weeks ago | Thread started: Sep 4, 08, 3:07 p.m.
- bezul555
Hi Guys, does anyone of you have or know some examples of query accordion that works on anchors (similar to this: http://www.duarte.com/#1.0.0 - this one is using different framework);
Once you click section - content is expanded and scrolled to top and # anchor appears in address bar. I have found a lot of accordion examples, but without anchor option. I also tried to combine accordion and scrollTo effectg but something went wrong.
- Sep 4, 08, 3:07 p.m. – Permalink
- adev
well first, that site is Flash, not javascript.. But here's soomething similar, sorta.... http://www.typeblue.com/temp/


- Dog-earSep 4, 08, 3:53 p.m. – Permalink
- janne76
http://bassistance.de/jquery-plu…
demo:
http://jquery.bassistance.de/acc…not sure about anchors though


- Dog-earSep 4, 08, 3:56 p.m. – Permalink
- acescence
I find the accordion plugin to be quite bloated since it's a does-everything-for-everyone type of thing.
I usually just do this stuff manually using slideUp and slideDown and binding them to whatever you want to trigger the actions.
the hash bit is a simple matter of just setting location.hash whenever something is clicked.
on document load, you can retrieve location.hash and open the proper section


- Dog-earSep 4, 08, 4:48 p.m. – Permalink
- bezul555
Good thing about anchor is that when you type address manually, you'll get the panel expanded; I have accordion working already, but can't combine it with anchors or slideTo effect; here is my code for accordion:
$(document).ready(function() {
$('#box> div> div.content').hide();
$('#headerMain > div').slideDown('slow');
$('#box> div> h2').click(function() {
var $nextDiv = $(this).next();
//var $visibleSiblings = $nextDiv.siblings('#box> div.content:visible');var $visibleSiblings = $(this).parent().siblings('#box> div').children('div:visible');
if ($visibleSiblings.length ) {
$visibleSiblings.slideUp(500, function() {
$nextDiv.slideToggle(600);
});
} else {
$nextDiv.slideToggle(600);
}
});
});adev - thanks for example with nice effect ;)


- Dog-earSep 5, 08, 4:40 a.m. – Permalink

