Spry Accordion Widget Jumps in Safari and Firefox
I'm an intermediate designer in Dreamweaver, and am developing a site with spry accordions in it, to have a lot of info in one spot.
My problem is when clicking on the next tab, the whole wiget jumps down quite a bit then slows down when the panel opens at the top.
I have no idea how to fix this, have searched forums and the code within the website.
I'm Stuck, Help me!
http://file:///Volumes/eb631806/c4%20executive%20security%20services/Site/training.html
http://file:///Volumes/eb631806/c4%20executive%20security%20services/Site/services.html
The links don't work, sorry
I'll figure out how to get a link that works, on here
Similar Messages
-
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 -
Firefox Spry Accordion widget
Hello, I am trying to use Spry Accordion widget. When I click one of the other panels they all turn a strange neon blue color. Anyone know of any fixes?
The below is the index page and below that is SpryAccordion.css
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>Conferences</title>
<script src="SpryCollapsiblePanel.js" type="text/javascript"></script>
<script src="../SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
<link href="css.css" rel="stylesheet" type="text/css" />
<style type="text/css">
</style>
<link href="../SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="outside">
<div id="outsideone">
<div id="CollapsiblePanel1" class="CollapsiblePanel">
<div class="CollapsiblePanelTab" tabindex="0">Tab</div>
<div class="CollapsiblePanelContent">
<p>Content ssss</p>
<p>lkajsdfl</p>
</div>
</div>
<script type="text/javascript">
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1");
</script>
<!-- This is commented out -->
<div id="photo"></div>
<div id="contentholder">
<div id="contentsone"> <div id="moreone">
<div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 1</div>
<div class="AccordionPanelContent">Content 1</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 2</div>
<div class="AccordionPanelContent">Content 2</div>
</div>
</div>
</div> <div id="insidecontentsone"></div></div>
<div id="lineone"> </div>
<div id="contentstwo"> <div id="moretwo">
<div id="Accordion2" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 1</div>
<div class="AccordionPanelContent">Content 1</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 2</div>
<div class="AccordionPanelContent">Content 2</div>
</div>
</div>
</div>
<div id="insidecontentstwo"></div></div>
<div id="linetwo"> </div>
<div id="contentsthree"> <div id="morethree">
<div id="Accordion3" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 1</div>
<div class="AccordionPanelContent">Content 1</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 2</div>
<div class="AccordionPanelContent">Content 2</div>
</div>
</div>
</div><div id="insidecontentsthree"></div></div>
</div>
</div>
</div>
<script type="text/javascript">
var Accordion1 = new Spry.Widget.Accordion("Accordion1", { defaultPanel: 1 });
var Accordion2 = new Spry.Widget.Accordion("Accordion2", { defaultPanel: 1 });
var Accordion3 = new Spry.Widget.Accordion("Accordion3", { defaultPanel: 1 });
</script>
</body>
</html>
SpryAccordion.css
@charset "UTF-8";
/* SpryAccordion.css - version 0.5 - 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-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-color: none;
border-bottom-color: none;
border-left-color: none;
background-image: url(white.png);
background-color: none;
border-top-style: none;
/* 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;
background-image: url(white.png);
/* 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: #CCCCCC;
border-top: solid 1px black;
border-bottom: solid 0px gray;
margin: 0px;
padding: 2px;
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
background-image: url(white.png);
/* 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;
padding: 0px;
height: 200px;
background-image: url(white.png);
/* 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: #none;
background-image: url(white.png);
/* 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: #555555;
background-image: url(white.png);
.AccordionPanelOpen .AccordionPanelTabHover {
color: none;
background-image: url(white.png);
/* 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: none;
background-image: url(white.png);
/* 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: none;
height: 15px;
background-image: url(white.png);
/* Rules for Printing */
@media print {
.Accordion {
overflow: visible !important;
background-image: url(white.png);
.AccordionPanelContent {
display: block !important;
overflow: visible !important;
height: auto !important;
background-image: url(white.png);Welcome to the Forum!
If you can upload your page to a server and give us a link, we will be able to look at your page in action. Just seeing the code is not enough.
Is this the first time you have used an Accordion? It is probable that the bright neon blue you are seeing is the default style, which you can change in the CSS file. I believe it was designed that color to highlight the feature you want to change .
Take a look in the Accordion's CSS file (it will show as an associated file at the top of your document window) for color rules, and adjust them to suit your palette (and your palate!). Check out the CSS Styles Panel (use Current mode) for a handy way to know what you are looking at. Click on the Accordion in Design View and the rules will be highlighted in the CSS Styles Panel. (Click the right-hand stair-step icon to see the style cascade.)
Beth -
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" />
<!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
#sidebar1 { width: 230px; }
</style>
<![endif]--><!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
#sidebar1 { padding-top: 30px; }
#mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<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" />
<!-- end #header -->
</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>
<!-- end #sidebar1 --></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>
<!-- end #mainContent --></div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="footer">
<p>© 2009 Luxury Yachts – bring a cup for the bailout</p>
<!-- end #footer --></div>
<!-- end #container --></div>
<script type="text/javascript">
<!--
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
//-->
</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 Behavior
I am using Dreamweaver CS3 and several Spry components. I am new to using Spry, but like how easy it is to impliment. One of the components I am trying to use is the Accordion Widget. The widget appears to function well (I am using variable panel heights) and the behavior appears as designed.
I am using the panel containers to list links to additional pages based on subject groups.
My question involves moving back and forth from the widget page to a listed pages, then back to the widget page.
The behavior I see is:
1) User loads widget page, widget panel 1 is expanded onload.
2) User expands different panel.
3) User clicks URL link within different panel.
4) User moves to new page (referenced URL page).
5) User reviews content, decides it is not appropriate and wants to select another URL.
6) User clicks the browser “back” button and returns to the widget page.
7) Widget page onload returns to expanded panel 1.
Is there a way for me to tweak the JavaScript so that the user returns to the expanded panel they left rather that panel 1? Is panel 1 always going to be the panel that opens on page load? (Unless I have the settings set to no expanded panes on page load.)
Thanke you for any suggestions.
TPKGreetings Arnout,
Sorry for the late reply. (Side-tracked with other work.)
I have a "outside-the-firewall" review area almost complete if you still have time to look at my code.
After testing several browsers and 2 platforms I have found that my problem is likely not with your code at all, but with small modifications that I have had to do to it. For example, I will need to have 2 separate Accordion blocks on the page I am developing.
When I drop Dreamweaver generated Spry code into the page the <div class="Accordion" ID="Accordion1"> is created (which suits my future needs, the additional block will have <div class="Accordion" ID="Accordion2">. I noticed that your code uses <div class="Accordion" ID="sampleAccordion">.
If I go through the cookie code and change all references of "sampleAccordion" to "Accordion1" the code breaks. I am missing something and haven't been able to find it.
Additionally, I noticed something odd when testing the widget. When testing using a Mac (Safari and Firefox) it appeared I didn't need the cookie code at all. The unmodified Dreamweaver Spry code appeared to hold the value of the launch panel when I moved from my launch page, to my receiver page, then back to my launch page.
This wasn't the case with Windows IE and Firefox. IE 6 appears broken onLoad, IE 8 and Firefox breaks when I go back to the launch page from the receiver page. Very odd behaviors. Tonight I will load your original code on a test page and add testing notes so that I have a "control".
The URL for the (several) test pages is: http://tim.kern.home.comcast.net/~tim.kern/
If you have any suggestions (for modifying the cookie code to work with more than one widget on a page) I would certainly appreciat them.
Thank you very much for the original code.
TPK -
Reliability of Spry Accordion Widget
I posed a question in this forum last week and was unable to
get a helpful answer to my problem. I am trying to use the Spry
Accordion Widget on a site:
http://www.jalc.org/JazzED/s_eac_B.html
I have researched here to learn how to get the panels to
start closed with one panel to be open by default. This works
exactly like expected in Firefox and Chrome but NOT in IE.
Am I wrong in my assumptions that:
1) Folks from Adobe monitor this board and chime in with
answers/solutions or acknowledgement of bugs; and
2) Spry widgets are a reliable cross-platform technology that
have had the bugs worked out
or, is the real case
1) Adobe folks only look into these forums on an occassional
basis, if at all; and
2) Spry widgets should be left alone if you are expecting
them to perform properly relative to cross-platform capabilities.
I appreciate anyone's feedback or suggestions on these
questions.
Thanks,
AndyI just re-read my post above and am mortified at the tone of
my message. It was in no way intended to come off as pissy, which I
fear it might have. Anyone with any thoughts on my issue, I would
appreciate your feedback.
Regards,
Andy -
Spry Accordion Widget appears incorrectly
Hello all,
I used the Spry accordion widget in my online portfolio (http://www.halyna.htsolutionsonline.com). I tested it in IE6, IE7, Mozilla and Safari browsers before uploading. It appeared and worked correctly. I also had friends test the site with their own PCs and Macs. Everything was reported to work correctly.
At work, I found that when I open the first panel of the accordion, the names of the rest of the panels move to the right and only the first open panel appears on the screen with the names of the bottom three panels to the right of the panel which makes all of it look very unprofessional. This doesn't happen when I open the following three panels. Everything appears as it should.
Can anybody shed light on what is causing this? As I mentioned, the site appears and works correctly everywhere else.
All help appreciated!!<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 -
Safari (and Firefox) hang on Flash-Pages for main-account
Since Easter (when I took the last batch of upgrades) Safari and Firefox hang.
I narrowed the test down to the following web-page:
http://www.sunfleet.com
* The page does not load completely - after a little while I get this spinning ball and need to kill the hanging Safari-process.
* The same web-page works flawless on a second account.
This is what i tried so far after reading the communities:
* Checked the safari-preferences, switched off auto-fill, security settings allow loading of plug-ins.
* Executed Onyx 2.1.4 - check disk, check and repair rights, run scripts
* deinstalled Flash and reinstalled it (10.0.45.2) according to the instructions on the Adobe Support Page
* manually removed the Flash Player folders in:
Home/Library/Preferences/Macromedia
Home/Library/Caches
The error still prevails.
It would be great if someone could instruct me what to do next.
I have a backup via time-machine, but I really don't know what to restore.
Message was edited by: step5Hi Carolyn!
In the mean-while I removed all the Internet Plugins that were registered under the main user:
real-player and move-media-player are now gone.
Still no change. I made a new trace below - I wonder, what is different on the main account compared to the other user. Could it be fonts ?
Best regards
Stephan
Date/Time: 2010-04-20 15:16:56 +0200
OS Version: 10.6.3 (Build 10D573)
Architecture: i386
Report Version: 6
Command: Safari
Path: /Applications/Safari.app/Contents/MacOS/Safari
Version: 4.0.5 (6531.22.7)
Build Version: 1
Project Name: WebBrowser
Source Version: 65312207
Parent: launchd [99]
PID: 1810
Event: hang
Duration: 4.85s (sampling started after 2 seconds)
Steps: 29 (100ms sampling interval)
Pageins: 0
Pageouts: 0
Process: Safari [1810]
Path: /Applications/Safari.app/Contents/MacOS/Safari
UID: 501
Thread 6813000 DispatchQueue 1
User stack:
28 ??? (in Safari + 7085) [0x2bad]
28 NSApplicationMain + 574 (in AppKit) [0x94fbdc85]
28 -[NSApplication run] + 821 (in AppKit) [0x94fc5bef]
28 ??? (in Safari + 46792) [0xc6c8]
28 -[NSApplication nextEventMatchingMask:untilDate:inMode:dequeue:] + 156 (in AppKit) [0x95003976]
28 _DPSNextEvent + 847 (in AppKit) [0x95004135]
28 BlockUntilNextEventMatchingListInMode + 81 (in HIToolbox) [0x96889d36]
28 ReceiveNextEventCommon + 354 (in HIToolbox) [0x96889eb1]
28 RunCurrentEventLoopInMode + 392 (in HIToolbox) [0x9688a0fc]
28 CFRunLoopRunInMode + 97 (in CoreFoundation) [0x99591f21]
28 CFRunLoopRunSpecific + 452 (in CoreFoundation) [0x995920f4]
28 __CFRunLoopRun + 557 (in CoreFoundation) [0x99592a1d]
28 __CFRunLoopDoObservers + 1186 (in CoreFoundation) [0x995d62e2]
28 _handleWindowNeedsDisplay + 696 (in AppKit) [0x9502dc26]
28 ??? (in Safari + 178380) [0x2c8cc]
28 -[NSWindow displayIfNeeded] + 204 (in AppKit) [0x94ffc6ec]
28 -[NSView displayIfNeeded] + 818 (in AppKit) [0x950333ee]
28 -[NSView _displayRectIgnoringOpacity:isVisibleRect:rectIsVisibleRectForView:] + 3309 (in AppKit) [0x950d2771]
28 -[NSThemeFrame _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 265 (in AppKit) [0x950d5e2b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 4668 (in AppKit) [0x950d722b]
28 -[WebHTMLView(WebPrivate) _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 312 (in WebKit) [0x958de6f8]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 2217 (in AppKit) [0x950d6898]
28 -[NSView _drawRect:clip:] + 3721 (in AppKit) [0x950d91cc]
28 -[WebHTMLView drawRect:] + 596 (in WebKit) [0x958dd3b4]
28 -[WebHTMLView drawSingleRect:] + 388 (in WebKit) [0x958dd5d4]
28 -[WebFrame(WebInternal) _drawRect:contentsOnly:] + 153 (in WebKit) [0x958dda09]
28 WebCore::FrameView::paintContents(WebCore::GraphicsContext*, WebCore::IntRect const&) + 236 (in WebCore) [0x9362476c]
28 WebCore::RenderLayer::paint(WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*) + 101 (in WebCore) [0x93624995]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 1563 (in WebCore) [0x93c71fbb]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 1563 (in WebCore) [0x93c71fbb]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 1563 (in WebCore) [0x93c71fbb]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 3705 (in WebCore) [0x93c72819]
28 WebCore::RenderBlock::paint(WebCore::RenderObject::PaintInfo&, int, int) + 213 (in WebCore) [0x93627315]
28 WebCore::RenderBlock::paintObject(WebCore::RenderObject::PaintInfo&, int, int) + 605 (in WebCore) [0x93625b9d]
28 WebCore::RenderBlock::paintChildren(WebCore::RenderObject::PaintInfo&, int, int) + 306 (in WebCore) [0x936261c2]
28 WebCore::RenderBlock::paint(WebCore::RenderObject::PaintInfo&, int, int) + 213 (in WebCore) [0x93627315]
28 WebCore::RenderBlock::paintObject(WebCore::RenderObject::PaintInfo&, int, int) + 605 (in WebCore) [0x93625b9d]
28 WebCore::RenderBlock::paintChildren(WebCore::RenderObject::PaintInfo&, int, int) + 306 (in WebCore) [0x936261c2]
28 WebCore::RenderBlock::paint(WebCore::RenderObject::PaintInfo&, int, int) + 213 (in WebCore) [0x93627315]
28 WebCore::RenderBlock::paintObject(WebCore::RenderObject::PaintInfo&, int, int) + 605 (in WebCore) [0x93625b9d]
28 WebCore::RenderBlock::paintContents(WebCore::RenderObject::PaintInfo&, int, int) + 81 (in WebCore) [0x93626041]
28 WebCore::RenderLineBoxList::paint(WebCore::RenderBoxModelObject*, WebCore::RenderObject::PaintInfo&, int, int) const + 912 (in WebCore) [0x93628e00]
28 WebCore::RootInlineBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 53 (in WebCore) [0x93629095]
28 WebCore::InlineFlowBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 575 (in WebCore) [0x9362938f]
28 WebCore::InlineBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 294 (in WebCore) [0x9362a616]
28 WebCore::RenderWidget::paint(WebCore::RenderObject::PaintInfo&, int, int) + 662 (in WebCore) [0x93703de6]
28 WebCore::ScrollView::paint(WebCore::GraphicsContext*, WebCore::IntRect const&) + 56 (in WebCore) [0x93734808]
28 WebCore::Widget::paint(WebCore::GraphicsContext*, WebCore::IntRect const&) + 456 (in WebCore) [0x93734e48]
28 -[NSView displayIfNeededInRectIgnoringOpacity:] + 578 (in AppKit) [0x951fa2ae]
28 -[NSView _displayRectIgnoringOpacity:isVisibleRect:rectIsVisibleRectForView:] + 3309 (in AppKit) [0x950d2771]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 711 (in AppKit) [0x950d62b6]
28 -[NSView _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 2039 (in AppKit) [0x950d7f4e]
28 -[NSView _recursiveDisplayDescendantsInRect:] + 427 (in AppKit) [0x95220a18]
28 -[NSView _recursiveDisplaySelfAndDescendantsInRect:] + 70 (in AppKit) [0x951fa381]
28 -[NSView _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 2039 (in AppKit) [0x950d7f4e]
28 -[NSView _recursiveDisplayDescendantsInRect:] + 427 (in AppKit) [0x95220a18]
28 -[NSView _recursiveDisplaySelfAndDescendantsInRect:] + 70 (in AppKit) [0x951fa381]
28 -[NSView _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 2039 (in AppKit) [0x950d7f4e]
28 -[NSView _recursiveDisplayDescendantsInRect:] + 427 (in AppKit) [0x95220a18]
28 -[NSView _recursiveDisplaySelfAndDescendantsInRect:] + 70 (in AppKit) [0x951fa381]
28 -[WebHTMLView(WebPrivate) _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 266 (in WebKit) [0x958d4b1a]
28 -[NSView _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 1600 (in AppKit) [0x950d7d97]
28 -[NSView _drawRect:clip:] + 3510 (in AppKit) [0x950d90f9]
28 -[WebHTMLView drawRect:] + 596 (in WebKit) [0x958dd3b4]
28 -[WebHTMLView drawSingleRect:] + 388 (in WebKit) [0x958dd5d4]
28 -[WebFrame(WebInternal) _drawRect:contentsOnly:] + 153 (in WebKit) [0x958dda09]
28 WebCore::FrameView::paintContents(WebCore::GraphicsContext*, WebCore::IntRect const&) + 236 (in WebCore) [0x9362476c]
28 WebCore::RenderLayer::paint(WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*) + 101 (in WebCore) [0x93624995]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 1563 (in WebCore) [0x93c71fbb]
28 WebCore::RenderLayer::paintLayer(WebCore::RenderLayer*, WebCore::GraphicsContext*, WebCore::IntRect const&, WebCore::PaintRestriction, WebCore::RenderObject*, ***::HashMap<WebCore::OverlapTestRequestClient*, WebCore::IntRect, ***::PtrHash<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::OverlapTestRequestClient*>, ***::HashTraits<WebCore::IntRect> >*, unsigned int) + 3705 (in WebCore) [0x93c72819]
28 WebCore::RenderBlock::paint(WebCore::RenderObject::PaintInfo&, int, int) + 213 (in WebCore) [0x93627315]
28 WebCore::RenderBlock::paintObject(WebCore::RenderObject::PaintInfo&, int, int) + 605 (in WebCore) [0x93625b9d]
28 WebCore::RenderBlock::paintChildren(WebCore::RenderObject::PaintInfo&, int, int) + 306 (in WebCore) [0x936261c2]
28 WebCore::RenderBlock::paint(WebCore::RenderObject::PaintInfo&, int, int) + 213 (in WebCore) [0x93627315]
28 WebCore::RenderBlock::paintObject(WebCore::RenderObject::PaintInfo&, int, int) + 605 (in WebCore) [0x93625b9d]
28 WebCore::RenderBlock::paintContents(WebCore::RenderObject::PaintInfo&, int, int) + 81 (in WebCore) [0x93626041]
28 WebCore::RenderLineBoxList::paint(WebCore::RenderBoxModelObject*, WebCore::RenderObject::PaintInfo&, int, int) const + 912 (in WebCore) [0x93628e00]
28 WebCore::RootInlineBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 53 (in WebCore) [0x93629095]
28 WebCore::InlineFlowBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 575 (in WebCore) [0x9362938f]
28 WebCore::InlineBox::paint(WebCore::RenderObject::PaintInfo&, int, int) + 294 (in WebCore) [0x9362a616]
28 WebCore::RenderWidget::paint(WebCore::RenderObject::PaintInfo&, int, int) + 662 (in WebCore) [0x93703de6]
28 WebCore::Widget::paint(WebCore::GraphicsContext*, WebCore::IntRect const&) + 456 (in WebCore) [0x93734e48]
28 -[NSView displayIfNeededInRectIgnoringOpacity:] + 578 (in AppKit) [0x951fa2ae]
28 -[NSView _displayRectIgnoringOpacity:isVisibleRect:rectIsVisibleRectForView:] + 3309 (in AppKit) [0x950d2771]
28 -[NSView _recursiveDisplayRectIfNeededIgnoringOpacity:isVisibleRect:rectIsVisibleRectFor View:topView:] + 711 (in AppKit) [0x950d62b6]
28 -[NSView _recursiveDisplayAllDirtyWithLockFocus:visRect:] + 1600 (in AppKit) [0x950d7d97]
28 -[NSView _drawRect:clip:] + 3510 (in AppKit) [0x950d90f9]
28 -[WebNetscapePluginDocumentView sendDrawRectEvent:] + 88 (in WebKit) [0x95906388]
28 WebNetscapePluginEventHandlerCarbon::drawRect(CGContext*, _NSRect const&) + 94 (in WebKit) [0x959063ee]
28 WebNetscapePluginEventHandlerCarbon::sendEvent(EventRecord*) + 94 (in WebKit) [0x959049fe]
28 -[WebNetscapePluginDocumentView sendEvent:isDrawRect:] + 312 (in WebKit) [0x95904b58]
28 FlashPlayer10_0_45_2FlashPlayer + 578 (in Flash Player) [0x19d65d22]
28 FlashPlayer10_0_45_2FlashPlayer + 688787 (in Flash Player) [0x19e0dd73]
28 FlashPlayer10_0_45_2FlashPlayer + 673290 (in Flash Player) [0x19e0a0ea]
28 FlashPlayer10_0_45_2FlashPlayer + 671087 (in Flash Player) [0x19e0984f]
28 ??? (in Flash Player + 1806251) [0x19c31fab]
28 ??? (in Flash Player + 1088652) [0x19b82c8c]
28 ??? (in Flash Player + 1074482) [0x19b7f532]
28 ??? (in Flash Player + 1392565) [0x19bccfb5]
28 ??? (in Flash Player + 1394781) [0x19bcd85d]
28 ??? (in Flash Player + 1392565) [0x19bccfb5]
28 ??? (in Flash Player + 1394781) [0x19bcd85d]
28 ??? (in Flash Player + 1392565) [0x19bccfb5]
28 ??? (in Flash Player + 1395775) [0x19bcdc3f]
28 ??? (in Flash Player + 1329897) [0x19bbdae9]
28 ??? (in Flash Player + 428241) [0x19ae18d1]
28 ??? (in Flash Player + 374059) [0x19ad452b]
28 ??? (in Flash Player + 338982) [0x19acbc26]
28 ??? (in Flash Player + 2974174) [0x19d4f1de]
28 ??? (in Flash Player + 2973238) [0x19d4ee36]
28 ??? (in Flash Player + 2960942) [0x19d4be2e]
28 ATSFontFindFromName + 69 (in ATS) [0x981a74c2]
28 _eATSFontFindFromName + 105 (in ATS) [0x981865d4]
28 FindFontFromName(__CFString const*, unsigned long, unsigned long const*, unsigned long*, unsigned char) + 1853 (in ATS) [0x981855d7]
28 FindFontIDFromNameInternal + 454 (in ATS) [0x9814078d]
28 FindFontIDFromNameInternalCore(unsigned long, unsigned long const*, unsigned long, unsigned long, unsigned long, unsigned char*, unsigned long, unsigned long, unsigned long*, FontNameCacheNode*) + 1581 (in ATS) [0x98140e46]
28 SendFindFontIDFromNameMessage + 361 (in ATS) [0x981638f7]
25 SendFontManagementMessageWithMessageStatus + 668 (in ATS) [0x9813c456]
25 RendezvousWithServer(unsigned long, char*) + 393 (in ATS) [0x9813c0e5]
25 SendFontManagementMessageWithMessageStatus + 235 (in ATS) [0x9813c2a5]
25 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
3 SendFontManagementMessageWithMessageStatus + 235 (in ATS) [0x9813c2a5]
3 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
28 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread b1df000 DispatchQueue 2
User stack:
28 start_wqthread + 30 (in libSystem.B.dylib) [0x908bdd86]
28 pthreadwqthread + 390 (in libSystem.B.dylib) [0x908bdf41]
28 dispatch_workerthread2 + 240 (in libSystem.B.dylib) [0x908be4be]
28 dispatch_queueinvoke + 163 (in libSystem.B.dylib) [0x908be719]
28 kevent + 10 (in libSystem.B.dylib) [0x908beb42]
Kernel stack:
28 kevent + 97 [0x46f6f6]
Thread 593a7a8
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 ***::TCMalloc_PageHeap::scavengerThread() + 614 (in JavaScriptCore) [0x988973e6]
28 pthreadcondwait$UNIX2003 + 73 (in libSystem.B.dylib) [0x908c7bb8]
28 _semwaitsignal + 10 (in libSystem.B.dylib) [0x908c6262]
Kernel stack:
28 semaphorewaitcontinue + 0 [0x22a264]
Thread 62d4b7c
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 ??? (in Flash Player + 3008767) [0x19d578ff]
28 FlashPlayer10_0_45_2FlashPlayer + 45551 (in Flash Player) [0x19d70ccf]
28 ??? (in Flash Player + 3007567) [0x19d5744f]
28 pthreadcondwait + 48 (in libSystem.B.dylib) [0x9090e42f]
28 semaphorewait_signaltrap + 10 (in libSystem.B.dylib) [0x90898342]
Kernel stack:
28 semaphorewaitcontinue + 0 [0x22a264]
Thread 6428000
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 _NSThread__main_ + 1499 (in Foundation) [0x9483488c]
28 -[NSThread main] + 45 (in Foundation) [0x948348dc]
28 ??? (in Safari + 209064) [0x340a8]
28 -[NSRunLoop(NSRunLoop) run] + 76 (in Foundation) [0x9486e25d]
28 -[NSRunLoop(NSRunLoop) runMode:beforeDate:] + 279 (in Foundation) [0x9486e380]
28 CFRunLoopRunInMode + 97 (in CoreFoundation) [0x99591f21]
28 CFRunLoopRunSpecific + 452 (in CoreFoundation) [0x995920f4]
28 __CFRunLoopRun + 2079 (in CoreFoundation) [0x9959300f]
28 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
28 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread 6773b7c
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 ??? (in Safari + 266653) [0x4219d]
28 ??? (in Safari + 266829) [0x4224d]
28 ***::ThreadCondition::timedWait(***::Mutex&, double) + 81 (in JavaScriptCore) [0x9877dc01]
28 pthreadcondwait$UNIX2003 + 73 (in libSystem.B.dylib) [0x908c7bb8]
28 _semwaitsignal + 10 (in libSystem.B.dylib) [0x908c6262]
Kernel stack:
28 semaphorewaitcontinue + 0 [0x22a264]
Thread 6b843d4
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 WebCore::IconDatabase::iconDatabaseSyncThread() + 180 (in WebCore) [0x935172d4]
28 WebCore::IconDatabase::syncThreadMainLoop() + 266 (in WebCore) [0x9351b40a]
28 pthreadcondwait$UNIX2003 + 73 (in libSystem.B.dylib) [0x908c7bb8]
28 _semwaitsignal + 10 (in libSystem.B.dylib) [0x908c6262]
Kernel stack:
28 semaphorewaitcontinue + 0 [0x22a264]
Thread 6ba3b7c
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 ??? (in Safari + 148869) [0x25585]
28 ??? (in Safari + 148972) [0x255ec]
28 ??? (in Safari + 149817) [0x25939]
28 CFRunLoopRunInMode + 97 (in CoreFoundation) [0x99591f21]
28 CFRunLoopRunSpecific + 452 (in CoreFoundation) [0x995920f4]
28 __CFRunLoopRun + 2079 (in CoreFoundation) [0x9959300f]
28 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
28 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread 6cf4000
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 ??? (in Flash Player + 3008767) [0x19d578ff]
28 FlashPlayer10_0_45_2FlashPlayer + 45551 (in Flash Player) [0x19d70ccf]
28 ??? (in Flash Player + 3007567) [0x19d5744f]
28 pthreadcondwait + 48 (in libSystem.B.dylib) [0x9090e42f]
28 semaphorewait_signaltrap + 10 (in libSystem.B.dylib) [0x90898342]
Kernel stack:
28 semaphorewaitcontinue + 0 [0x22a264]
Thread b72fb7c
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 select$DARWIN_EXTSN + 10 (in libSystem.B.dylib) [0x908b7286]
Kernel stack:
28 sleep + 52 [0x486017]
Thread b7633d4
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 FlashPlayer10_0_45_2FlashPlayer + 2207972 (in Flash Player) [0x19f80bc4]
28 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
28 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread b76a7a8
User stack:
28 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
28 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
28 _NSThread__main_ + 1499 (in Foundation) [0x9483488c]
28 -[NSThread main] + 45 (in Foundation) [0x948348dc]
28 +[NSURLConnection(NSURLConnectionReallyInternal) _resourceLoadLoop:] + 329 (in Foundation) [0x9486d434]
28 CFRunLoopRunInMode + 97 (in CoreFoundation) [0x99591f21]
28 CFRunLoopRunSpecific + 452 (in CoreFoundation) [0x995920f4]
28 __CFRunLoopRun + 2079 (in CoreFoundation) [0x9959300f]
28 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
28 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread 6b0d7a8
User stack:
17 start_wqthread + 30 (in libSystem.B.dylib) [0x908bdd86]
17 _workqkernreturn + 10 (in libSystem.B.dylib) [0x908bdbd2]
Kernel stack:
17 bsdthread_create + 1313 [0x4c90b9]
Thread b6f83d4
User stack:
14 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
14 pthreadstart + 345 (in libSystem.B.dylib) [0x908c5a19]
14 TimerThread + 97 (in CarbonCore) [0x971523eb]
14 TSWaitOnSemaphoreCommon + 511 (in CarbonCore) [0x9712e1a3]
14 TSWaitOnConditionTimedRelative + 242 (in CarbonCore) [0x9712e465]
14 pthreadcond_timedwait_relativenp + 47 (in libSystem.B.dylib) [0x908f4a28]
14 semaphoretimedwait_signaltrap + 10 (in libSystem.B.dylib) [0x9089835a]
Kernel stack:
14 semaphorewaitcontinue + 0 [0x22a264]
Thread 6bfe000
User stack:
11 start_wqthread + 30 (in libSystem.B.dylib) [0x908bdd86]
11 _workqkernreturn + 10 (in libSystem.B.dylib) [0x908bdbd2]
Kernel stack:
11 bsdthread_create + 1313 [0x4c90b9]
Binary Images:
0x1000 - 0x1b5fe7 com.apple.Safari 4.0.5 (6531.22.7) <179BBADD-7C49-EF3C-BD19-E988CCD9AE10> /Applications/Safari.app/Contents/MacOS/Safari
0x19a79000 - 0x1a0b3ffb com.macromedia.Flash Player.plugin 10.0.45.2 (1.0.4f458472) <D1AAAB5D-4178-61E6-A5B8-35B01D303955> /Library/Internet Plug-Ins/Flash Player.plugin/Contents/MacOS/Flash Player
0x90897000 - 0x90a3cfeb libSystem.B.dylib ??? (???) <06A5336A-A6F6-4E62-F55F-4909A64631C2> /usr/lib/libSystem.B.dylib
0x93514000 - 0x93d47fe7 com.apple.WebCore 6531.22 (6531.22.7) <952A0D34-63F5-F7F7-D6E5-D0AD78002F89> /System/Library/Frameworks/WebKit.framework/Versions/A/Frameworks/WebCore.frame work/Versions/A/WebCore
0x9481e000 - 0x94a8effb com.apple.Foundation 6.6.2 (751.21) <DA7A173A-4435-ECD6-F4AF-977D722FD2F7> /System/Library/Frameworks/Foundation.framework/Versions/C/Foundation
0x94fbc000 - 0x9589bff7 com.apple.AppKit 6.6.5 (1038.29) <E76A05A6-27C6-DA02-0961-5C8EEDC5F0A7> /System/Library/Frameworks/AppKit.framework/Versions/C/AppKit
0x958c1000 - 0x959a5ff7 com.apple.WebKit 6531.22 (6531.22.7) <87C81D6F-77B1-C517-93E6-5DEF214326A7> /System/Library/Frameworks/WebKit.framework/Versions/A/WebKit
0x96855000 - 0x96b79fef com.apple.HIToolbox 1.6.2 (???) <F5F99E78-5377-DD54-6138-9FC84467F938> /System/Library/Frameworks/Carbon.framework/Versions/A/Frameworks/HIToolbox.fra mework/Versions/A/HIToolbox
0x970e7000 - 0x97407feb com.apple.CoreServices.CarbonCore 861.6 (861.6) <D3D5D9F1-01ED-DCAD-6AA9-4ABE60C7A112> /System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/CarbonC ore.framework/Versions/A/CarbonCore
0x9813b000 - 0x981d6ff7 com.apple.ApplicationServices.ATS 4.1 (???) <22FCDB9B-B588-D602-3991-26A2E3C51E6E> /System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/ ATS.framework/Versions/A/ATS
0x98775000 - 0x98913feb com.apple.JavaScriptCore 6531.22 (6531.22.5) <3FB9AF5B-17DD-D4C8-C7B1-4F79B404496E> /System/Library/Frameworks/JavaScriptCore.framework/Versions/A/JavaScriptCore
0x99556000 - 0x996cfffb com.apple.CoreFoundation 6.6.1 (550.19) <1E97FB1E-9E42-B8EB-E463-5C75315FDA31> /System/Library/Frameworks/CoreFoundation.framework/Versions/A/CoreFoundation
Process: Address Book [1485]
Path: /Applications/Address Book.app/Contents/MacOS/Address Book
UID: 501
Thread 53557a8 DispatchQueue 1
User stack:
29 ??? (in Address Book + 8013) [0x2f4d]
29 NSApplicationMain + 574 (in AppKit) [0x94fbdc85]
29 -[NSApplication run] + 821 (in AppKit) [0x94fc5bef]
29 -[NSApplication nextEventMatchingMask:untilDate:inMode:dequeue:] + 156 (in AppKit) [0x95003976]
29 _DPSNextEvent + 847 (in AppKit) [0x95004135]
29 BlockUntilNextEventMatchingListInMode + 81 (in HIToolbox) [0x96889d36]
29 ReceiveNextEventCommon + 354 (in HIToolbox) [0x96889eb1]
29 RunCurrentEventLoopInMode + 392 (in HIToolbox) [0x9688a0fc]
29 CFRunLoopRunInMode + 97 (in CoreFoundation) [0x99591f21]
29 CFRunLoopRunSpecific + 452 (in CoreFoundation) [0x995920f4]
29 __CFRunLoopRun + 2079 (in CoreFoundation) [0x9959300f]
29 machmsgtrap + 10 (in libSystem.B.dylib) [0x908982fa]
Kernel stack:
29 ipcmqueue_receivecontinue + 0 [0x210c23]
Thread 6c837a8 DispatchQueue 2
User stack:
29 start_wqthread + 30 (in libSystem.B.dylib) [0x908bdd86]
29 pthreadwqthread + 390 (in libSystem.B.dylib) [0x908bdf41]
29 dispatch_workerthread2 + 240 (in libSystem.B.dylib) [0x908be4be]
29 dispatch_queueinvoke + 163 (in libSystem.B.dylib) [0x908be719]
29 kevent + 10 (in libSystem.B.dylib) [0x908beb42]
Kernel stack:
29 kevent + 97 [0x46f6f6]
Thread 6721b7c
User stack:
29 start_wqthread + 30 (in libSystem.B.dylib) [0x908bdd86]
29 _workqkernreturn + 10 (in libSystem.B.dylib) [0x908bdbd2]
Kernel stack:
29 bsdthread_create + 1313 [0x4c90b9]
Thread 6843000
User stack:
29 thread_start + 34 (in libSystem.B.dylib) [0x908c589e]
29 ***::TCMalloc_PageHeap::scavengerThread() + 614 (in JavaScriptCore) [0x988973e6]
29 pthreadcondwait$UNIX2003 + 73 (in libSystem.B.dylib) [0x908c7bb8]
29 _semwaitsignal + 10 (in libSystem.B.dylib) [0x908c6262]
Kernel stack:
29 semaphorewaitcontinue + 0 [0x22a264]
Binary Images:
0x1000 - 0x19ff7 com.apple.AddressBook 5.0.1 (868) <DE60243F-6088-4B3A-F214-815B6506722F> /Applications/Address Book.app/Contents/MacOS/Address Book
0x90897000 - 0x90a3cfeb libSystem.B.dylib ??? (???) <06A5336A-A6F6-4E62-F55F-4909A64631C2> /usr/lib/libSystem.B.dylib
0x94fbc000 - 0x9589bff7 com.apple.AppKit 6.6.5 (1038.29) <E76A05A6-27C6-DA02-0961-5C8EEDC5F0A7> /System/Library/Frameworks/AppKit.framework/Versions/C/AppKit
0x96855000 - 0x96b79fef com.apple.HIToolbox 1.6.2 (???) <F5F99E78-5377-DD54-6138-9FC84467F938> /System/Library/Frameworks/Carbon.framework/Versions/A/Frameworks/HIToolbox.fra mework/Versions/A/HIToolbox
0x98775000 - 0x98913feb com.apple.JavaScriptCore 6531.22 (6531.22.5) <3FB9AF5B-17DD-D4C8-C7B1-4F79B404496E> /System/Library/Frameworks/JavaScriptCore.framework/Versions/A/JavaScriptCore
0x99556000 - 0x996cfffb com.apple.CoreFoundation 6.6.1 (550.19) <1E97FB1E-9E42-B8EB-E463-5C75315FDA31> /System/Library/Frameworks/CoreFoundation.framework/Versions/A/CoreFoundation -
Spry Accordion Jerky/Jumping movement Issues in IE
I am having a difficult time trying to debug the accordion in IE. You can see the accordion here in IE I am having two issues.
1. When at the top of the site and clicking on a tab to open it jumps down the page as if it were an anchor point, and I find this very annoying.
2. The movement below the tab clicked is jumping around and this also is incredibly annoying to me, its more subtle than the above issue but it still bothers me. I am having this issue in GC as well.
I have searched quite a few forums and have not found a solution for this but this must be a fairly common issue? I am not that familaur with spry yet this is my first real project using it so my knowledge is very limited to this point. This dose work perfect in FF.
Thanks in advance,I will put together a gutted version of this and send it over if you have the time that would be fantastic. Making a gutted version may be the best thing at this point so I can slowly add stuff back and see what causes the problem. If i cant fix it by doing that I will zip and send the files.
Date: Tue, 27 Oct 2009 15:23:40 -0600
From: [email protected]
To: [email protected]
Subject: Spry Accordion Jerky/Jumping movement Issues in IE
Can you provide me with files where I can reproduce your issue with
out any other scripts on the site? This gives me a better debugging
area. If you do not feel comfy with posting it online. You can e-mail
it to mailto:[email protected]
> -
SPRY accordion widget IE8 ONLY issue
hello everybody,
i noticed a strange "jumpy" behavior while using the spry accordion widget -- this affects IE8 only (currently using 8.0.6001.18882 on vista), other browsers (including IE7 and IE8 forced into IE7 mode) work as expected. this issue seems to be related to the margin property of the accordion container...
not shure whether this behavior is related to IE rendering or the spry javascript code itself... anyway i made NO changes to the spry script (my version is 0.15, 1.6.1, which i believe to be most recent one).
the xhtml (strict) and css are perfectly valid (there might be some MINOR css hacks which are not related to the accordion itself). i do NOT use ANY padding on the inner container of the accordion (which would definetely make the spry js count the tween in odd way). the accordions (especially the main menu on the left) are little more complex, but they were built according to the spry widget document, found on the adobe spry website.
so, here it is -- check the accordion on the left side (the bug seems to happen almost always while opening/closing the last BLUE "section" of the accordion, please play with the accordion for a while to reproduce it -- while the accordion closes, it "loses" it's bottom margin (i guess), what's even more wierd, everything gets back to place after you move a mouse):
http://www.prazskematky.cz/home.php
PLEASE NOTICE: since the website is still under development and i'm using a IE meta tag to force it into IE7 rendering, to reproduce this behavior please be shure to switch IE engine to IE8 standards mode
well, we all now how IE handles css... so it's propably an IE bug -- anyway if you have encountered a similar issue of even better found a fix, please let know. (i don't consider a fix switching to another js library, i would like to use the spry, because of it's DW integration)
many thanks,
p.s.ross m. greenberg wrote:
> Now however the entire .gif is not appearing in the
accordion panel is expanded. I insert the graphic using a standard
"menu insert/graphic/browse and select"
>
> the graphic file is not showing up properly on such an
insert...
Are you referring to what it looks like in Design view? If
so, that's
correct. Accordion panels have a fixed height. From memory, I
think it's
200px. However, if you test the page in a browser, you should
see a
scrollbar automatically generated on panels that have content
that
exceeds the height of the panel.
If you want flexible-height panels in the accordion, you need
to adjust
both the CSS and the script that initializes the accordion. I
have
covered all the details in my "Essential Guide to Dreamweaver
CS3" (and
the forthcoming CS4 edition). You can probably find online
tutorials as
well. Try a Google search for Spry flexible height accordion.
The accordion widget has been around since CS3, and it hasn't
changed in
CS4, so a Google search should bring up a lot of information.
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS3" (friends of
ED)
Author, "PHP Solutions" (friends of ED)
http://foundationphp.com/ -
IWeb-generated site OK in Safari and Firefox, but no NavBar in IE
I created a site in iWeb and it displays fine in Safari and Firefox. However, the entire NavBar section is not displaying in Internet Explorer, despite loose permissions for running code in IE.
The script section from one of the pages appears below, and any help or suggestions are much appreciated. I need to get this site up, and really need it to be accessible for IE users.
Thanks.
<script type="text/javascript"><!--//--><![CDATA[//><!--
new NavBar('widget0', 'Scripts/Widgets/Navbar', 'Scripts/Widgets/SharedResources', '.', {"current-page-GUID": "79F60B32-4240-4A88-8823-11CC50E1FDF2", "path-to-root": "", "isCollectionPage": "NO", "navbar-css": ".navbar {\n\tfont-family: 'Times', 'Times New Roman', serif;\n\tfont-size: .9em;\n\tcolor: #817B67;\n\tmargin: 0px;\n\tline-height: 25px;\n}\n\n.navbar-bg {\n\ttext-align: left;\n}\n\n.navbar-bg ul {\n\tlist-style: none;\n\tmargin: 0px;\n\tpadding: 0px;\n}\n\n\nli {\n\tlist-style-type: none;\n\tdisplay: inline;\n\tpadding: 0 25px 0 0px;\n}\n\n\nli a {\n\ttext-decoration: none;\n\tpadding: 0px;\n\tcolor: #817B67;\n}\n\nli a:visited {\n\ttext-decoration: none;\n\tpadding: 0px;\n\tcolor: #817B67;\n}\n\nli a:hover\r{\r\n \tcolor: #3F3F3C;\n\ttext-decoration: none;\r}\n\n\nli.current-page a\r{\r\t color: #3F3F3C;\n\ttext-decoration: none;\r}\n"});
//--><!]]></script>Are you using the navigation menu that comes with the page template? If so, it will not display on a PC with Internet Explorer unless javascript is turned on in the preferences. The template nav bars in iWeb use java and if this is not enabled on some computers, then it cannot be seen.
What you can do so that it will show up in IE, is to create your own text based navigation bar instead - to do this, just open the Inspector and then go to Page - second choice in and click on the boxes which say hide navigation menu and then just create your own by using a text box, shape or whatever. Don't forget to hyperlink to your pages though. -
Have a Dreamweaver question about the Spry Accordion widget.
I am designing a website for a real estate company. I will have different pages set up as a state page with a sub-level of cities within the page. I am using the accordion widget for the cities. As you know, you click on the panel tab and the next panel drops up or down closing/opening the previous panel.
What I would like to do is add an action anchor (view all properties) outside the spry widget to open all the panels at once if a client wanted to see the entire list. However, I would still want the functionality of the panels to be collapsible. Is this possible? Is there a bit of code restructuring I would have to do to the JavaScript?Try
<!DOCTYPE html>
<html>
<head>
<title>Untitled Document</title>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet">
<style>
.openit .AccordionPanelContent {
display: block !important;
overflow: visible !important;
height: auto !important;
</style>
</head>
<body>
<a href="#" class="openAll">open all</a> - <a href="#" class="closeAll">close all</a>
<div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 1</div>
<div class="AccordionPanelContent">Content 1</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">Label 2</div>
<div class="AccordionPanelContent">Content 2</div>
</div>
</div>
<script src="SpryAssets/SpryAccordion.js"></script>
<script src="SpryAssets/SpryDomUtils.js"></script>
<script>
function MyOpenAllEventHandler() {
Spry.$$("#Accordion1").addClassName("openit");
function MyCloseAllEventHandler() {
Spry.$$("#Accordion1").removeClassName("openit");
Spry.$$(".openAll").addEventListener("click" , MyOpenAllEventHandler, false);
Spry.$$(".closeAll").addEventListener("click" , MyCloseAllEventHandler, false);
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
</script>
</body>
</html>
The "!important" on these rules is necessary because the Accordion widget places inline styles on the actual AccordionPanelContent elements when opening and closing them. Since inline styles have a higher CSS specificity then CSS class rules, "!important" is necessary to "trump" the inline styles.
Gramps -
Automatically Animating Spry Accordion Widget on Page Load
I've been searching and searching and still can't find a clue
as how to make the Spry Accordion Widget automatically open the
next panel. I want the panels to expand automatically and loop back
at the last panel.
Do I need to create another function for this or is there
already a function created in the .js file?
Any help is appreciated...even if you can point me in the
right direction.
Thanks!DeviseInnovations wrote:
> I've been searching and searching and still can't find a
clue as how to make
> the Spry Accordion Widget automatically open the next
panel. I want the panels
> to expand automatically and loop back at the last panel.
>
> Do I need to create another function for this or is
there already a function
> created in the .js file?
>
> Any help is appreciated...even if you can point me in
the right direction.
Sounds more like you'd want sliding panels:
http://labs.adobe.com/technologies/spry/samples/slidingpanels/SlidingPanelsSample.html
I've seen an automatic version created that might do what you
want:
http://www.3rd-eden.com/Spry-it.com/examples/slidingpanelsautomatic/
But if you really want an Accordion, then you might be able
to adapt the code in the auto sliding panels above.
FYI: There's a Spry forum that would be better to post Spry
related question in:
http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602
Danilo Celic
|
http://blog.extensioneering.com/
| WebAssist Extensioneer
| Adobe Community Expert -
Spry Accordion widget Question
Have a Dreamweaver question about the Spry Accordion widget.
I am designing a website for a real estate company. I will have different pages set up as a state page with a sub-level of cities within the page. I am using the accordion widget for the cities. As you know, you click on the panel tab and the next panel drops up or down closing/opening the previous panel.
What I would like to do is add an action anchor (view all properties) outside the spry widget to open all the panels at once if a client wanted to see the entire list. However, I would still want the functionality of the panels to be collapsible. Is this possible? Is there a bit of code I would have to add to the JavaScript?
Is there a genius out there that can hook me up with some knowledge?I actually did away with the accordian widget and went a different route. It was too glitchy. Thanks for your input though. I will take note of the suggestions you provided and maybe try it out one day.
-
Spry Accordion Widget Init Closed, Without Snap?
(This is a topic discussed in
another
thread, but I didn't want to hijack the thread with my own
question, so I started a new one...)
I want to start my Accordion widget in a closed state. I
figured out the trick of setting the default panel to '-1' and
turning fixed heights by altering the code in the footer of the
page to:
var Accordion1 = new Spry.Widget.Accordion("Accordion1",
{defaultPanel: -1,
useFixedPanelHeights: false});
When you do this, however, the page loads with the first
accordion panel open and visible for a split second until the page
is loaded, at which point the widget snaps the panel shut. This is
very ugly and undesirable, especially given that this accordion is
on a page element common to every page on the site.
I've tried setting an initial class that is hidden, however
the Spry Accordion widget is written in such a way that it
preserves whatever classes you have rather than replacing them.
Does anyone know a way to load the page with the accordion
panels shut without this initial flash of the first panel snapping
shut?
Thanks,
SteveHey Al,
Nice plug for your own application! Here is another one,
since I am one of your happy customers.
I used the Spry widgets in the new DW CS3 and spent a couple
of days trying to tweak things to get them to work the way I
wanted. After getting input from my brother (his site that I am
working on) he really wanted some more style than what I was coming
up with using the basic DW widget. I smacked my dollar on the
barrel head and tried out PVII Accordion instead.
I can't tell you how fast and easy it was to insert and
customize this plugin. Not to mention they had some nice little
themed styles, one of which (the cobalt blue) was a real close
match to the color scheme I originally was using! (PS - any chance
of getting more theme styles down the road for this plugin or
matching styles for the other ones???)
Changing the open or closed state of the panels - it was so
simple!!! I simply went into the modify option and chose the number
that corresponded to my different panels in the menu list. My buddy
used an expression about DW CS3 that fits nicely with using tools
like PVII Accordion Magic. You can use a screwdriver with some
precision and a lot of hand strength to build what you want but it
will take you alot of time...or you can plugin a power drill and be
done with it!
To see it in action on my current work in progress go to:
http://www.dvdflashbacks.com/williamsburghealth/index.php
As for sstringer's original question - how to do this in DW's
Spry widget...
I think you are onto the right track with the -1 setting. If
I am not mistaken though, Spry uses 0 for the first panel, so I
think you would need to use an option like {defaultTab: 1} to open
the 2nd panel and so on.
PS - Just so everyone knows - I am not a sales person for
PVII - just a very satisfied customer!
Maybe you are looking for
-
I have a UTF-8 string that contains some Chinese characters (result from an LDAP search on a Windows 2000 directory user who has a Chinese name). The attribute.get() returns a string that encodes each Chinese character as three characters. I believe
-
ARGH! Someone help me PLEASE!
So pretty much I'm super bummed. Last week I tried to plug my iPod into my car adapter. The little apple came up but then the folder icon with the exclamation point came up. Naturally I came to the website to figure out what I could do to revive it.
-
After Firefox started crashing I reinstalled it. It crashed immediately. I wasn't able to open it in safe mode.
-
hai i have doubt that aggregates contain request ids or not? and if one cube has 4 aggregates and i want to load latest request only into 2 aggregates where can we do ? bye srinu
-
Track plays in iTunes on my computer, but won't on my ipod.
just got this nano for xmas.