Dreamweaver's Spry Accordion jumpy in browsers

[gobble17]

Hi guys

I am using some of Dreamweaver's built in Spry Assets to create an 'Accordion' style drop down nav.

www.carbonstudio.co.uk/civitasweb (rough)

For some reason the area of the screen below the nav that gets clicked seems to 'wobble' up and down a bit whilst the nav is rearranging.

Is this a known issues? Does anyone know how to rectify it? Does anyone know of a solution that could be implemented by someone who's intermediate at using Dreamweaver?

Thanks

 

[SrWebDeveloper]

It's not a known issue, just this version doesn't allow timing values to be configurable in the global config at the top, they are all hardcoded into the functions that animate the menus. Here is help for this software (see advice at bottom as well):

Backup the originals then search/replace either of these two lines in SpryCollapsiblePanel.js and SpryAccordion.js:

this.steps = 10;

this.duration = 500;

These lines are found in functions that handle the animation for collapsing and expanding the accordian effect via DHTML. Play around by reducing the duration value first (which is 500 miliseconds) then increase the steps by factors of 10 if not the desired effect in each script. Bear in mind the original values may be optimum for most browsers or slower computers out there since this is, after all, client side scripting.

Beyond this, look into other frameworks that are known for outstanding smoothness and quality, i.e.

http://www.artviper.eu/mootoolsmenu/

The demo on that page blew me away, it seems to be just what you want and it works fast, smooth, and cross platform compatible.

-jim

 

[gobble17]

Thanks for your advice. I tried altering the values but it didn't entirely solve the problem.

Checked out your suggested link but there didn't appear to be any .js files to download and I'm not that great at picking .js apart from source!

I am playing with this version as we speak which is pretty much exactly what I need!

http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu-glossy.htm

 

[SrWebDeveloper]

As to mootools, which is vastly superior, download the mootools.js here. Then go back to the page I linked earlier, simply view source and modify, strip out what you don't need. The HTML for the menu is easy to spot, adjust the styles and keep the JavaScript in the bottom easily identifiable with the <script> tag wrapping it. It's all right there and not alot of code.

I can't customize it for you because you have you own menu system and images, of course. But maybe someone here with more time on their hands can extract relevant code for ya. Consider this a strong suggestion, I don't have any other advice on the script you've been trying. It does what it does and you've spent alot of time trying to tweak it already. Maybe switching is worthwhile?

-jim