Re-Size Each Panel of Accordion Widget Independently

I would like to have varying widths on the panels listed below my Accordion Widget tabs. For example. I have a lot of content in one tab so I need it to expand farther left than other tabs that have less information.
Thank you in advance for your help!

Take a look at this thread in regards to adjusting the width of the Accordion widget - http://forums.adobe.com/message/5140254.
The width of the Content Area within an Accordion panel would dictate the overall width of the Accordion and would remain consistent for each tab within the Accordion.
Thanks,
Vinayak

Similar Messages

"Can close all" option not working for content panel within accordion widget

Hi. I can close an accordion menu by clicking the header but it won't close by clicking on the content panel itself (even though I have can close all selected in the flyout.) I've seen tutorials where it works but I can't replicate. Seems like a bug.
Thanks for any ideas on how to fix or a workaround.
I'm on the CC 2014.3 release. Mac OS 10.10.2
P

Hello,
if you using OAW (Outlook AnyWhere) check the authentication method
get-OutlookAnywhere -Identity "<Servername>xpv00645\RPC (Default Web Site)" | fl *AuthenticationMethod*
I think it is set of NTLM or Negotiate.
Outlook 2007 has negotiate
problems at an OAW connection
authentication.
Change the authentication to NTLM for
the internal and Basic for the extenal method.
You need to reconfigure the Outlook Exhange settings to anonymous authentication and in the proxy settings to default authentication

Problem with Accordion Widget INSIDE Sliding Panel Widget

Hello,
perhaps I should not do this, but I nested an Accordion
Widget inside a Sliding Panels Widget:
- There are eight Panels.
- Each one contains a complete Accordion.
The sliding works fine, and so does the Accordion animation,
but the text inside the Accordion Panel Tabs won't move along, when
a tab is activated. I need to hover the mouse over the accordion to
make the panel texts appear again.
Of course, when I un-nest the widgets and move the Accordion
widget out of the Sliding Panel widget, everything is fine.
My question is:
- am I demanding "too much" by nesting the widgets?
- or should this basically work, and the problem arises from
rivalling scripts?
Here is a link:
Nested
widgets Test
The horizontal top menu will activate the sliding panels, but
as of now only the leftmost menu item contains an Accordion (I know
the CSS does not look nice yet).
Is there anything I can optimise to get this to work?
Thank you so much,
Greetings, Jensen
Edit: The problem does NOT occur in Firefox, but in
Safari.

Hi John,
That is the expected behavior if the "Overlap items below" is unchecked. Please refer to the following link http://screencasteu.worldsecuresystems.com/aish/2013-08-21_1947.png. If you don't want the page to wiggle up and down, please check the box shown in the screenshot.
Regards,
Aish

How do I add a new panel to the accordion widget in-between two others (NOT at the end)

In the accordion widget, the + button at the bottom adds a new panel to the end. I have a series of panels that are in alpha-sort and need to add a new panel in the middle... I can't figure out how to do it without re-doing the whole thing. is there a way to do this?

Gah! Thanks Mac.
That was the first thing I tried! I must not have had the right level selected. It's been driving me batty, but I've got it now.

Accordion widget - put a button to go to next panel

Hi,
There is any way to put a button that, if some form's
requestes are respected, go to next panel?
I understood this make the next panel appear
Spry.Widget.Accordion.prototype.openNextPanel = function()
return this.openPanel(this.getCurrentPanelIndex() + 1);
but some ting like that (put in the page) doesn't work
if( validation == true){
function nextPanel()
return this.openPanel(this.getCurrentPanelIndex() + 1);
I need also to disable the function making go to next panel
on clicking the "label" (So the button will be the only way to
change panel)

No one knows?

Accordion widget - Toggling the Panel?

I know this is probably simple but...
1) How do I make the Accordion widget Panels "Open &
Close" by clicking on the same Panel twice?
What I mean is that my Accordion Panel works fine &
"Opens" when clicked once, but will not "Close" when clicked again?
(I want to be able to quickly open & close selected
panels at ease)
2) How do I apply a CSS to the Accordion without affecting
the original CSS style?
Earlier when went in to the Accodion.css file & started
making changes, it messed up the Accordion itself & I could not
get back to it's original look?
Thanks for the help,
jlig

Cristian, Thanks for the update.
In regards to using Accordions & Panels, it would really
help to see a video tutorial on the workshop site that shows how to
use ADDT Forms & Lists with SPRY widgets like the Collapsible
Panel. Many of us are a bit unclear on how to target links between
the two and general integration of the two.
For example:
- What is the sequence?
1. Create a Blank DW page
2. Add the SPRY Panel
3. then ADDT records/Forms?
Or
1. Create a Blank DW page
2. Add the ADDT records/Forms
3. Add the SPRY panels, etc?
Also, From an RIA point of view it seems like the purpose of
AJAX is to get rid of all the "screen/page changes". Can you help
us understand for example, the process of converting regular
dynamic forms (via ADDT or otherwise) that have many pages, to AJAX
enabled links that point to Panels, Tabs & Accordions instead?
Thanks for all your expertise,
jlig

Accordion widget - Toggling the Panels Up & Down?

What do I change in the Accordion widget to make the panels
Open & Close?
I want the Panel to Open by clicking on Panel A, and then
have Panel A close if Panel A again. (Basically a Toggle
effect)

Cristian, Thanks for the update.
In regards to using Accordions & Panels, it would really
help to see a video tutorial on the workshop site that shows how to
use ADDT Forms & Lists with SPRY widgets like the Collapsible
Panel. Many of us are a bit unclear on how to target links between
the two and general integration of the two.
For example:
- What is the sequence?
1. Create a Blank DW page
2. Add the SPRY Panel
3. then ADDT records/Forms?
Or
1. Create a Blank DW page
2. Add the ADDT records/Forms
3. Add the SPRY panels, etc?
Also, From an RIA point of view it seems like the purpose of
AJAX is to get rid of all the "screen/page changes". Can you help
us understand for example, the process of converting regular
dynamic forms (via ADDT or otherwise) that have many pages, to AJAX
enabled links that point to Panels, Tabs & Accordions instead?
Thanks for all your expertise,
jlig

Accordion widget browser panel height

I am using the accordion widget browser and would like to shorten the height of the
panels - how can I do this...

I found the solution!
Sample of before: www.muohio.edu/lll/studyabroadweek/index2.html
Sampe of after: www.muohio.edu/lll/studyabroadweek.
The solution was at: http://docs.jquery.com/UI/Accordion#options but was a bit difficult for me to figure out how to implement it... after a bit of experiment - I got it!
In your .html document, at the beginning of the widget look for the code in black. Code in bold red is what was needed to solve the issue.
$(function(){
                // Accordion
                $("#jQueryUIAccordion").accordion({ header: "h3",
                                            animated: "slide",
                                            event: "click",
                                            collapsible : "false",
                                            autoHeight: false

Left Navbar Accordion Widget - Able to keep panel open after click?

Hi there,
I'm using a spry accordion widget as my left navbar. We're hoping there's a way to make the panels stay open after a link is clicked and it goes to a page. This would make it easier for people to know which area they are in instead of trying to remember which panel's link they just clicked.
You can see my site here.
I realize this will need to go into the js area and I've already made a few changes in there. Any input anyone can provide would be helpful.
Thanks!

As usual, Gramps, you've been a tremendous help.
It took me a while to get to this as I was in training and had other things going on. And it took me about 3 days to figure out. My site is much larger than the one you referred me to and instead of pulling in the files I have to link to the actual pages. But I finally figured it out.
So, for those who want to see another example, you can see my (work) site here.
Thanks again, Gramps. You're the greatest!

Collapsible Panel Widget vs. Accordion Widget

The difference between the two types of widgets appears to be that the latter has the structure: tab1/contenta; tab/content2; etc. with only one tab/content open at one time, whereas the former has structure tab/content1,content2 etc though and all are open or closed.
Is this a correct understanding of the difference between the two widgets? Also, how does one add or delete additional content sections to the Collapsible panel widget?
Thanks, CMA

cma cma wrote:
The difference between the two types of widgets appears to be that the latter has the structure: tab1/contenta; tab/content2; etc. with only one tab/content open at one time, whereas the former has structure tab/content1,content2 etc though and all are open or closed.
Is this a correct understanding of the difference between the two widgets? Also, how does one add or delete additional content sections to the Collapsible panel widget?
Thanks, CMA
You might like to consult the following three webpages. The first two will give you a clear idea of what is meant by the terms tabbed and collapsible panels in an Adobe context. The last page is my own implementation of Adobe's SPRY Accordion Panel.
The Tabbed Panel Widget: http://livedocs.adobe.com/en_US/Spry/SDG/help.html?content=WS6FED301A-59A1-45ce-BC1F-11074 3A27FE9.html
The Collapsible Panel Widget: http://livedocs.adobe.com/en_US/Spry/SDG/help.html?content=WS3C6DC7F9-0443-46a4-AC65-D222B BEBAD15.html
The Accordion Widget (Example): http://homepage.mac.com/moogoonghwa/Imagine_Prototype/Content/
Roddy

Dreamweaver Accordion Widget default panel

I'm relatively new to javascript.
I'm using the Spry Accordion widget that comes with dreamweaver.
I want to use it as a menu, so I have tables inside it with links.
I have all the tabs closed for the index page
I am looking for the clicked tab to remain open.
How does one go about doing this?
Thanks in advance for your help.

Check out these samples
http://go.spry-it.com/cookie

Shortening accordion widget buttons MUSE

Hi guys
I was wondering how to shorten the accordion widget buttons in muse. They seem unable to reduce below a certain width and I would like the left and right edges to be closer to my text/
Any suggestion would be much appreciated.
Cheers,
- Coen

Personally I would try the tabbed panel widget instead. Then you would have narrower links but they would be beside each other instead of on top of each other.
Another option may be to go with no border and then add a similar graphic as i fill that is narrower and centered.

DW Tutorial Question (Spry Accordion Widget) Beginner... :-(

Hi, I've just finished this tutorial (http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt2.html) but have a problem with my Spry Accordion Widget, when I preview the site my footer moves when I select a different panels in the widget, I've read back and checked code/css but I still can't sus it out (Don't laugh if it's something obvious!) Please can anyone help me? I've copied code/CSS below.
A BIG THANKS IN ADVANCE!!
INDEX...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>The Yacht Club</title>
<link href="main.css" rel="stylesheet" type="text/css" />

<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="header"><img src="images/logo.jpg" width="290" height="144" />
    
</div>
<div id="sidebar1">
    <h3>Welcome</h3>
    <ul id="nav"><li><a href="javascript:;">Home</a></li><li><a href="javascript:;">About Us</a></li><li><a href="javascript:;">Membership</a></li><li><a href="javascript:;">Our Boats</a></li><li><a href="javascript:;">Current Races</a></li><li><a href="javascript:;">Contact Us</a></li>
    </ul>
    <div id="Accordion1" class="Accordion" tabindex="0">
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Atlantic Ocean</div>
        <div class="AccordionPanelContent">Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</div>
      </div>
<div class="AccordionPanel">
        <div class="AccordionPanelTab">Pacific Ocean</div>
        <div class="AccordionPanelContent">Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</div>
      </div>
      <div class="AccordionPanel">
        <div class="AccordionPanelTab">Indian Ocean</div>
        <div class="AccordionPanelContent">Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</div>
      </div>
    </div>
    <p> </p>
</div>
<div id="mainContent">
    <h1> Luxury Yachts</h1>
    <p><img src="images/sailboat.jpg" alt="Sailboat" width="136" height="310" class="fltrt" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh. Donec nec libero.</p>
    <h2>Sail to the Bahamas </h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam, justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
</div>
<br class="clearfloat" />
<div id="footer">
    <p>© 2009 Luxury Yachts – bring a cup for the bailout</p>
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>
MAIN CSS...
@charset "UTF-8";
body {
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
padding: 0;
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
background-color: #FDFDFD;
background-image: url(images/body_BG.jpg);
background-repeat: repeat-x;
h1, h2, h3 {
font-weight: normal;
color: #00583F;
h1 {
font-size: 140%;
h2 {
font-size: 130%;
h3 {
font-size: 120%;
#container {
width: 780px;
margin: 0 auto;
text-align: left;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
background-image: url(images/container_bg.gif);
background-repeat: repeat-y;
#header {
background-color: #DDDDDD;
background-image: url(images/headerBG.jpg);
background-repeat: no-repeat;
padding-top: 0;
padding-right: 10px;
padding-bottom: 0;
padding-left: 0px;
#sidebar1 {
float: left; /* since this element is floated, a width must be given */
width: 200px; /* the background color will be displayed for the length of the content in the column, but no further */
padding: 15px 10px 15px 20px;
ul#nav {
background-image: url(images/buoy.jpg);
background-repeat: no-repeat;
background-position: left bottom;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 153px;
padding-left: 0px;
list-style-type: none;
#nav li a {
font-size: 90%;
color: #FFF;
text-decoration: none;
background-color: #09553F;
display: block;
padding: 4px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #3574A7;
#nav li a:hover, #nav li a:active, #nav li a:focus {
color: #123464;
background-color: #B7DAD8;
#mainContent {
margin: 0 0 0 250px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
#mainContent p, #sidebar1 p, #footer p {
font-size: 85%;
line-height: 1.4;
#footer {
background-color: #00593D;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 270px;
#footer p {
margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
color: #FFF;
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
float: right;
margin-left: 8px;
.fltlft { /* this class can be used to float an element left in your page */
float: left;
margin-right: 8px;
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
SPRY CSS...
@charset "UTF-8";
/* SpryAccordion.css - version 0.4 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* This is the selector for the main Accordion container. For our default style,
* we draw borders on the left, right, and bottom. The top border of the Accordion
* will be rendered by the first AccordionPanelTab which never moves.
* If you want to constrain the width of the Accordion widget, set a width on
* the Accordion container. By default, our accordion expands horizontally to fill
* up available space.
* The name of the class ("Accordion") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style the
* Accordion container.
.Accordion {
overflow: hidden;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-color: #7C9297;
border-bottom-color: #7C9297;
border-left-color: #7C9297;
/* This is the selector for the AccordionPanel container which houses the
* panel tab and a panel content area. It doesn't render visually, but we
* make sure that it has zero margin and padding.
* The name of the class ("AccordionPanel") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel container.
.AccordionPanel {
margin: 0px;
padding: 0px;
/* This is the selector for the AccordionPanelTab. This container houses
* the title for the panel. This is also the container that the user clicks
* on to open a specific panel.
* The name of the class ("AccordionPanelTab") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel tab container.
* NOTE:
* This rule uses -moz-user-select and -khtml-user-select properties to prevent the
* user from selecting the text in the AccordionPanelTab. These are proprietary browser
* properties that only work in Mozilla based browsers (like FireFox) and KHTML based
* browsers (like Safari), so they will not pass W3C validation. If you want your documents to
* validate, and don't care if the user can select the text within an AccordionPanelTab,
* you can safely remove those properties without affecting the functionality of the widget.
.AccordionPanelTab {
background-color: #00583F;
margin: 0px;
padding: 2px;
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
color: #FFF;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #7C9297;
border-bottom-color: #7C9297;
/* This is the selector for a Panel's Content area. It's important to note that
* you should never put any padding on the panel's content area if you plan to
* use the Accordions panel animations. Placing a non-zero padding on the content
* area can cause the accordion to abruptly grow in height while the panels animate.
* Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
* Content container.
* The name of the class ("AccordionPanelContent") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel content container.
.AccordionPanelContent {
overflow: auto;
margin: 0px;
height: 200px;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
/* This is an example of how to change the appearance of the panel tab that is
* currently open. The class "AccordionPanelOpen" is programatically added and removed
* from panels as the user clicks on the tabs within the Accordion.
.AccordionPanelOpen .AccordionPanelTab {
background-color: #FFF;
color: #005b3E;
/* This is an example of how to change the appearance of the panel tab as the
* mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
* and removed from panel tab containers as the mouse enters and exits the tab container.
.AccordionPanelTabHover {
color: #AAC7CE;
.AccordionPanelOpen .AccordionPanelTabHover {
color: #555555;
/* This is an example of how to change the appearance of all the panel tabs when the
* Accordion has focus. The "AccordionFocused" class is programatically added and removed
* whenever the Accordion gains or loses keyboard focus.
.AccordionFocused .AccordionPanelTab {
background-color: #00583F;
color: #FFF;
/* This is an example of how to change the appearance of the panel tab that is
* currently open when the Accordion has focus.
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {
background-color: #FFF;
color: #00583F;
Apologies in advance if I'm asking a daft question!!

Hi,
using your source code, I couldn't find a really inserted "Spry Accordion". If I do that (translated from german DW) > Insert > Spry > Spry Accordion, I'll find in my DW source code something like that:
<div id="Accordion1" class="Accordion" tabindex="0">
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Bezeichnung 1</div>
      <div class="AccordionPanelContent">Inhalt 1</div>
    </div>
    <div class="AccordionPanel">
      <div class="AccordionPanelTab">Bezeichnung 2</div>
      <div class="AccordionPanelContent">Inhalt 2</div>
    </div>
</div>
and in design view:
Please control your DW-entries.
Hans-G.

Spry Accordion Widget hiccups and more

Hi, I am using the Spry Accordion Widget on my website and have the following problems:
1. Is there a way for the accordion movement not to affect the images that are placed below it. For example, I have the accordion placed on top of 3 different logos. Whenever, the accordion panels move up and down (in use) all the contents (below the accordion) moves with it. I don't want the logos to move up and down whenever someone clicks on the panels. How do I make the logos stationary so its placements won't change?
I don't want to use an ap div tag because that would force my website to be in a fix position on a page. All I have been using to position my graphics are div tags and floats; no ap div tags. If you resize the browser window you will see that my website is somewhat elastic. Meaning, the graphics are always in the center of the page regardless of the size of the browser window—this is something I want to keep.
Please go here for better understanding: http://meinaco.net/tblLists.html
2. When one of the accordion tab is clicked there seems to be some kind of hiccup/jump/jerky (up and down movement) before it settles/stops. Is there a way to fix that? I noticed the accordion moves up and down smoothly prior to my inserting the images into the tab panels. To be clear, the images I am referring to are the brown horizontal lines with white words on a green background. Do these images have anything to do with this problem?
3. When the 1st tab (the restaurant panel) is open and another tab is selected, the restaurant panel displays large incorrectly styled text for a brief second as it closes to allow the other panel to open. I know it has something to do with my style sheet but I can't figure out what is causing it. I checked my css files and it seems they all have the correct size. To see this problem reoccur please do the following:
Make sure the restaurant panel is open then click on another panel (one of the 3 panels). As you click on the second panel pay attention to the text that sits inside the restaurant panel. You will see that large minus leading text will appear for a split second.
4. When I run my webpage (url mentioned above) on Safari 4.0.3 there seems to be a blue line outlining the whole accordion widget. This outline doesn't exist on Firefox nor on Opera. Please see attached image for clarity.
Any suggestions or help on any of these problems is greatly appreciated! Thank you in advance.
Meina
I hope someone can help me resolve or give me suggestions for the 1st and 2nd problems at the very least.

<div class="AccordionPanelContent">Castaway the: Restaurant<br />
              1250 Harvard Rd.<br />
              Burbank, CA 91501<br />
              - www.castawayrestaurant.com - (818) 848-6691</p>
Oops!
Missing the opening <p>
I didn't find it, the validator did.
Martin

Advice on linking to specific tabs in Accordion widget.

Hi everyone, I have followed David Power's tutorial on linking to specific tabs in an Accoridion widget.
I have got a test page working: http://fuelrecruitmenttest.co.uk/linktest.html which links to specific stories on my news page.
My problem is, I'm adding news stories in the accordion panel, so the newest story goes on the top.
Javascript counts the top panel as 0, the second panel as 1 etc etc.
So if I was to add a new panel, any previous links I have to the top panel would be to the wrong story.
My question is, Is there anyway of counting from the bottom panel up? Or any other workaround that people can think of eg: giving each panel a unique identifier so that the links remain the same even when new stories are added.
Thanks!

What is that?
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"RedEyeBlind" <[email protected]> wrote in
message
news:gpcfeo$f31$[email protected]..
> Hello anybody.
>
> I've tried the following still nothing but first tab.
> ?tab=1#TabbedPanels1

Re-Size Each Panel of Accordion Widget Independently

Similar Messages

Maybe you are looking for