Re: [jQuery] Animated Accodian WAS - RE: jquery rocks

2007-02-26 Thread Jörn Zaefferer
Alex Cook schrieb:
> This code should give you a hint on what to do next, at the least.  It
> could prolly be refined a bit as well.  Also, I didn't mess with any of
> the styles, and left that to you to figure out.  Hope it helps.
>   
I haven't looked in detail at your code, but noticed that you don't use 
any of the arguments of the change callback. Those may help.

They are not very well documented, but there is one example:

$('#accordion').Accordion().change(function(event, newHeader, oldHeader, 
newContent, oldContent) {
  $('#status').html(newHeader.text());
});

-- 
Jörn Zaefferer

http://bassistance.de


___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/


[jQuery] Animated Accodian WAS - RE: jquery rocks

2007-02-26 Thread Alex Cook
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On
Behalf Of TE Gossman
Subject: [jQuery] jquery rocks

hi all jquery newbie here,

Another great idea that I think would receive some attention is if
somebody could code up something like this:
http://www.presidentielles.net/

tyler

-

Tyler,

Here's an initial crack at mimicking the effect seen on
http://www.presidentielles.net/, using the Accordian Plugin and
setInterval.

Check out http://pastebin.ca/373454 for the code.

I've used Joern's awesome Accordian plugin here, so first things first,
go visit http://bassistance.de/jquery-plugins/jquery-plugin-accordion/
and snag a copy.  Done?  Okay, moving on.

First I construct a very basic DL block, using DT's for headers and DD's
for content.  .accordian() uses this HTML setup as its default layout,
so I just used that to start with.

Next, I call the .accoridan() function, using the default settings.
Then I bind an onChange event to the DL, meaning whenever something
within the DL changes, this function will be called.  Within the
function I'm assigning a value to the nextTab attribute I've attached to
the #list1 element.  The function gets the number of DD's within the DL
(our header element), and grabs the index of the currently selected DD.
It adds 1 to the currTab, and then checks if this number is greater then
the DD length.  If so, it makes nextTab = 0.  Then it assigns this value
to the nextTab attribute.

Finally, a setInterval call is scheduled to check the value of the
nextTab attribute and .activate() the tab accordingly.

I also clearInterval the current timer and create a new one each time
the DL changes, so when a user clicks on a new header the timer is
reset.

I was unable to mimic the functionality of
http://www.presidentielles.net/ where the click removes the timer
entirely because I was unable to attach a second click event to the
header.  I'm sure there is a way to do it I just didn't spend much time
investigating it.

This code should give you a hint on what to do next, at the least.  It
could prolly be refined a bit as well.  Also, I didn't mess with any of
the styles, and left that to you to figure out.  Hope it helps.

-ALEX

___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/