Spry collasible panels: open/closed
I see that it is possible to set the default state for spry
collapsible panels and have had success doing so. However,
is it possible to designate the open/closed state for each
individual panel within a Collapsible Panel Group? I can
foresee times when one or more of my panels may be empty and
therefore don't want to waste space by having them open
automatically.
You can indeed.
Click into any of the panels, and the definition box above it
comes up (something like Spry Collapsible Panel:
CollapsiblePanel[number]) comes up. Click on this box (it's blue
coloured in CS3) - then the properties box at the bottom of the
screen displays the options for display and default state, as it
did when you put in the first panel.
Matt.
Similar Messages
-
Spry Collapsible panel - open and closed default question...
I am using a Spry Collapsible panel in a vertical nav menu (DW CS4) and it's in a template for my site. I want it to be closed as default on the Home page, but when a visitor clicks to open it and selects their option, I would like it to remain open on the selected page - Is there a way to do this?
Thank you all!
AzaCheck out the examples on this page: http://www.spry-it.com/examples/spry-widget-cookie-history/#collapsiblepanel
-
How to make Spry Collapsible Panels open one at a time?
Hello,
I am using CS5 and want to use the spry collapsible panels. What I notice (and I think this wasn't the case in cs3) is that all panels can be open at the same time. I don't want that happen. I only want one panel to be open at a time. If someone clicks on a panel that is closed, I want the current panel to close and the one they clicked on to open. I don't want multiple panels to be opne at once. How can I do this? I am not a web developer by any means, so please be easy on me with code. I think in CS3 it used to work this way. Any help would be appreciated! Thank you in advance!GRAMPS!! That's it!! It was the accordian panel I had used in the past!!!! Oh, thank you, I was driving myself crazy as to why it wasn't working the way I had remembered!!!!!!!! THANK YOU!!
I was told you would probably help me find the right answer by Hans-g!
Thanks again! -
Spry accordian panel not closing
I have created a page using both the spry tabbed panels and
accordian panels. The accordian panels are in the content sections
of the tabbed ares. I want the accordian panels to be closed
initially, and whenever you click on the tab of the panel it will
open if it is closed, and close if it is open. I have modified the
code (as described in the Adobe Resource section) at the bottom of
the div. I got it to work on a simpler page (without the tabbed
panels) but I can't get it to close when click on if open. It will
close if another tab is clicked, but that isn't what I want. I'm
thinking it has something to do with the fact that it is in the
tabbed panels spry, or I am overlooking something. I am not very
verse in javascript, so I can't troubleshoot it. Can someone look
at the code and suggest a solution? The site is
http://www.capitolphotointeractive.com/testHi amilesslady,
You'll need to replace the version of the SpryAccordion.js
file on your site with a more recent one. You can get the the one
from Spry 1.6.1 here:
http://labs.adobe.com/technologies/spry/widgets/accordion/SpryAccordion.js
Or you can download the Dreamweaver 1.6.1 updater and use it
to update the Spry related files in Dreamweaver and your sites.
http://download.macromedia.com/pub/labs/spry/1/spry_p1-6-1_updater_022508.mxp
--== Kin ==--. -
Make a spry collapsible panel open on hover??
Hi All,
I'm trying to play with the Spry Collapsible Panel and would
like to have it open on hover but not on the on click, I've
attached the standard js code Dreamweaver produces, and would be
very grateful if you could highlight what needs to be
changed,---http://labs.adobe.com/technologies/spry/articles/tabbed_panel/index.html
See the section titled Open panels programmatically
<li class="TabbedPanelsTab" tabindex="0"
onmouseover="TabbedPanels1.showPanel(0)">Tab 1</li>
<li class="TabbedPanelsTab" tabindex="0"
onmouseover="TabbedPanels1.showPanel(1)">Tab 2</li>
Ken Ford
Adobe Community Expert - Dreamweaver
Fordwebs, LLC
http://www.fordwebs.com
"miachu" <[email protected]> wrote in
message news:fvihb0$miq$[email protected]..
> hi there,
>
> did you ever find a solution to this dreamweaver
collapsible panel problem? i
> am having the same problem...i need it to open on hover
instead of click. it
> makes so much more sense for them to have it on
hover/roll over!
>
> help would be much appreciated!
> thanks.
> -
Spry collapsible panel open by default
Hi there,
I've done a couple of sites where the left nav bar is a
series of
collapsible panels, each one housing links to products within
a specific
line. Would it be possible to insert code somewhere to get
one of the panels
open by default when you open a certain page, ie if you open
the 'suncare'
page the 'suncare' panel is open on load. I read something
about this on the
Adobe documentation but when I tried it it did't work.
It needs to be code somewhere on the page that interacts with
the spry
panel, I can't put it on the panel itself as I'm using a SSI
to insert the
nav bar into dozens of pages.
Many thanks...Check out the examples on this page: http://www.spry-it.com/examples/spry-widget-cookie-history/#collapsiblepanel
-
Spry Tabbed Panels- Open link on click
I am completely new to Dreamweaver and web design in general so please bear with me. I have created a tab menu using Spry Tabbed Panels but dont know how to make it so once a tab has been clicked an html file (ex. tab1.html which is saved on my computer) opens in the content portion, not open a new window.Can anyone post a tutorial or if its simple enough, post some directions?
Any help would be appreciated!Spry Tabbed Panels are not a "menu" per se, but a series of panels, all but one of which remain hidden until their tab is clicked. Tabbed Panels is a Spry "disclosure" widget. All the content may actually exist on the same page as the Tabbed Panels widget, or you can use <iframe></iframe> to 'surface' other pages in your Tabbed Panel Content divs.
As it sounds as if you want to use the <iframe> approach, here's how:
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">First Panel</li>
<li class="TabbedPanelsTab" tabindex="0">Second Panel</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">This is the content of the first panel <br /><iframe src="heirloom.html" width="100%" height="800" frameborder="0"></iframe></div>
<div class="TabbedPanelsContent">This is the content of the second panel <br /><iframe src="data.html" width="100%" height="500"></iframe></div>
</div>
</div>
You can also omit the frameborder="0" if you want to keep the default look of an iframe. Remember to give both a height and a width to your iframes. Test them in several different browsers (or BrowserLab) to make sure they look the way you want.
Beth -
Spry tabbed panels, opening a tabbed panel, problem with IE
i've have made a site, with tabbed panels,
all the pages are made of a template;
everythings works fine; in Firefox and Opera,
but only in IE when i open a tabbed panel from a menubar, the contents is opened behind my header location;
i've used spry 1.6.1 and spryUtils to open the tabbed panel.
because there no other posibilty to open a tabbed panel from my other page.
i've tested the site on CSS and all, and i've don't get any errors.
this site is only on our intranet, and DVD;
so is not a online site
i' dont have anything modified in the java script.
just changed some minor adjustments to the CSS of the tabbed panels
The page is containing a fixed footer and header, FOR all browsers therefore is the CSS IE hacks also.
and all other functions work normal.
i'm only a beginner at this
CSS
body,html {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
body{
color: #000;
background-attachment: fixed;
background-image: url(../afbeeldingen/Sitepictures/HaupteingangPB.jpg);
font-family: Arial, Helvetica, sans-serif;
font-size: 95%;
#img2 {
height: 2cm;
width: 2cm;
border:0;
#img {
margin-right: 10px;
height: 3cm;
width: 3cm;
border:0;
TD{
font-family: Arial;
font-size: 8pt;
line-height: normal;
vertical-align: top;
text-align: left;
#header-wrap {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 5;
#header-container {
height: 120px;
background-repeat: repeat-x;
background-position: left bottom;
#header {
width: 1040px;
margin: 0 auto;
position: relative;
#header-content{
width: 1040px;
position: relative;
background-image: url(../afbeeldingen/Sitepictures/background.jpg);
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
#header ul li {
float: left;
margin-right: 2px;
#container {
width: 1040px;
padding-top: 120px;
padding-bottom:50px;
background-color: #FFF;
margin-bottom: 0px;
left: auto;
right: auto;
margin-right: auto;
margin-left: auto;
position: relative;
height: auto;
min-height:100%;
#container a:link {
color: #00C;
text-decoration: none;
#container a:visited {
color: #F8495A;
text-decoration: none;
#container a:hover {
color: #00C;
text-decoration: underline;
#container a:active {
color: #00B004;
text-decoration: none;
#kolommaker
width:1040px;
background-color: #CEECAE;
height: 100%;
float: left;
#boven {
width: 1040px;
position: static;
height: 180px;
background-color: #FFF;
#sitecontent {
width: 1040px;
background-color: #FFF;
height: 100%;
#TabbedPanels1 {
width: 1040px;
position: static;
background-color: #FFF;
height: 100%;
float: left;
.links, .rechts, .midden {
height:100%;
display: inline-table;
background-color: #FFF;
.links{
float: left;
width: 330px;
font-size: 12px;
padding-top: 5px;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
.rechts{
padding-top: 5px;
float: right;
width: 330px;
text-align: left;
font-size: 12px;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
.midden{
padding-top: 5px;
width: 330px;
text-align: left;
font-size: 12px;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
#footer-wrap {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 5;
#footer-container {
height: 50px;
background-image: url(../images/footer-bg.png);
background-repeat: repeat-x;
background-position: left bottom;
#footer {
width: 1040px;
margin: 0 auto;
position: relative;
background: #FFF;
#contentfooter {
width: 1040px;
margin-top: 0;
margin-right: auto;
position:relative;
margin-bottom: 0;
margin-left: auto;
height:50px;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #F00;
text-align: center;
.leftfooter {
float: left;
.rightfooter {
float: left;
#iframe {
height: 600px;
min-height: 600px; }
.result_title a:link {
color: #00C;
text-decoration: none;
.result_title a:visited {
color: #F8495A;
text-decoration: none;
.result_title a:hover {
color: #00C;
text-decoration: underline;
.result_title a:active {
color: #00B004;
text-decoration: none;
.description { font-size: 100%; color: #008000; }
.docs {border:0;}
.pdf {border:0;}
.images {border:0;}
.excell {border:0;}
.exe {border:0;}
.clock {
text-align: center;
background: #FFF;
border: 1px solid #CCC;
height: 20px;
width: 175px;
font-size: 12px;
.clearfix {
content:".";
width:100%;
height: 0;
clear: both;
display: block;
visibility: hidden;
/* Hides from IE-mac \*/
.clearfix {height: 1%;} /* for IE/Mac */
CSS IE hacks
html{
overflow: hidden;
body{
overflow: auto;
#header-wrap, #footer-wrap {
position: absolute;
#header-container, #footer-container,{
margin-right: 16px;
#ie6-container-wrap {
position: absolute;
width: 100%;
height:100%;
overflow:auto;
#TabbedPanels1 {
position: absolute;
.TabbedPanels {
position: absolute;
#boven {
padding-top: 100px;
#container {
padding-top: 60px;
height :100%;
#sitecontent {
height: 100%;
#footer-wrap {
bottom: -1px;
#header img, #footer img
display: block;
Template
<!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" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Naamloos document</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="../Stijlbladen/main4.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../Stijlbladen/pro_dropdown_3.css"/>
<script src="../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script type="text/javascript" src="../SpryAssets/SpryURLUtils.js"></script>
<script type="text/javascript">var params = Spry.Utils.getLocationParamsAsObject(); </script>
<link href="../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/stuHover.js" type="text/javascript"></script>
<script type="text/javascript" src="../Scripts/percentageProgressBar.js"></script>
<script type="text/javascript" src="../Scripts/paswoord.js"></script>
<!--[if lt IE 7 ]>
<link href="../Stijlbladen/ie6hacks.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>
<!--ZOOMSTOP-->
<div id="header-wrap">
<div id="header-container">
<div id="header">
<div id="header-content">
<table width="890" border="0" cellspacing="1">
<tr>
<td width="100" height="50"><a href="../Sites/Index.html"><img src="../afbeeldingen/Sitepictures/WN_OriginalImage.jpg" width="90" height="50"/></a></td>
<td width="680">
<span class="preload1"></span>
<span class="preload2"></span>
<ul id="nav">
<li class="top"><a href="#nogo2" id="Algemeen" class="top_link"><span class="down">Algemeen</span></a>
<ul class="sub">
<li><b>Alg. Procedure</b></li>
<li><a href="#nogo3" class="fly">Car Policy</a>
<ul>
<li><a href="../Algemeen/CAR POLICY WN_dec2009.doc">Carpolicy NL</a></li>
<li><a href="../Algemeen/CAR POLICY WNdec2009FR.doc">Carpolicy FR</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">Gsm Policy</a>
<ul>
<li><a href="#nogo8">Gsm Policy NL</a></li>
<li><a href="#nogo9">Gsm Policy FR</a></li>
</ul>
</li>
<li><b>Diversen</b></li>
<li><a href="../Algemeen/Skills.htm">Skills</a></li>
<li><a href="../Sites/Verlof-Recup.html">Verlof</a></li>
<li><a href="../Sites/Verlof-Recup.html">Recup</a></li>
</ul>
</li>
<li class="top"><a href="#nogo2" id="Support" class="top_link"><span class="down">Support</span></a>
<ul class="sub">
<li><a href="../Algemeen/support/Artikellijst.xls">ArtikelLijst</a></li>
<li><a href="../Algemeen/support/Retail Algemeen.xls">Retail Algemeen</a></li>
<li><a href="../Algemeen/support/Barcodes v2-2.pdf">Barcode's ALL</a></li>
<li><a href="../Algemeen/support/CRM 2.2.pdf">CRM 2.2</a></li>
<li><a href="#nogo7" class="fly">Onkostennota</a>
<ul>
<li><a href="../Algemeen/dbourdon_1109.xls">Onkostennota NL</a></li>
<li><a href="../Algemeen/décompte de frais July 2009.xls">Onkostennota FR</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">Online Tools</a>
<ul>
<li><a href="file://///Wincor-nixdorf/projects/BE/D34POOL/STOCK MAALBEEK/FIELD/PLOMPEN RETAIL LOC WB.xls">Stock E.Plompen</a></li>
<li><a href="../Sites/login.html">Online map</a></li>
<li><a href="../Sites/Fujitsu.html">Fujitsu Portal</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">FAX Franchisé</a>
<ul>
<li><a href="../Algemeen/support/Fax franchisé NL4.doc">Franchisé NL</a></li>
<li><a href="../Algemeen/support/Fax franchisé FR4.doc">Franchisé FR</a></li>
</ul>
</li>
</ul>
</li>
<li class="top"><a href="#nogo22" id="Contacts" class="top_link"><span class="down">Contacts</span></a>
<ul class="sub">
<li><a href="../Algemeen/contacts/technician.pdf">Retail Tech</a></li>
<li><a href="../Algemeen/contacts/telretail.xls">Tel Ret/Helpdesk</a></li>
<li><a href="../Algemeen/contacts/Telefoonlijst WN + WNS.xls">Tel WN/WNS</a></li>
</ul>
</li>
<li class="top"><a href="#nogo27" id="Klanten" class="top_link"><span class="down">Klanten</span></a>
<ul class="sub">
<li><a href="../Sites/Aldi.html">Aldi</a></li>
<li><a href="../Sites/Little Customers.html?tab=0#tabbedpanels1">Belgique Loisirs</a></li>
<li><a href="../Sites/Bonita.html">Bonita</a></li>
<li><a href="../Sites/Carrefour.html">Carrefour</a></li>
<li><a href="../Sites/C&A.html">C & A</a></li>
<li><a href="../Sites/Decathlon.html">Decathlon</a></li>
<li><a href="../Sites/Delhaize.html">Delhaize</a></li>
<li><a href="../Sites/Ici Paris XL.html">Ici Paris</a></li>
<li><a href="../Sites/Ikea.html">Ikea</a></li>
<li><a href="../Sites/Little Customers.html?tab=3#tabbedpanels1">Koodza</a></li>
<li><a href="../Sites/Kruidvat.html">Kruidvat</a></li>
<li><a href="../Sites/Lidl.html">Lidl</a></li>
<li><a href="../Sites/Living Tomorrow.html">Living Tomorrow</a></li>
<li><a href="../Sites/Mediamarkt.html">Mediamarkt</a></li>
<li><a href="../Sites/Scapino.html">Scapino</a></li>
<li><a href="../Sites/Little Customers.html?tab=2#tabbedpanels1">Takko</a></li>
<li><a href="../Sites/Little Customers.html?tab=1#tabbedpanels1">Texto</a></li>
</ul>
</li>
<li class="top"><a href="#nogo63" id="ThirdParty" class="top_link"><span class="down">3th Party</span></a>
<ul class="sub">
<li><a href="../Sites/third party.html?tab=5#tabbedpanels1">Fujitsu Siemens</a></li>
<li><a href="../Sites/third party.html?tab=4#tabbedpanels1">HP</a></li>
<li><a href="../Sites/third party.html?tab=6#tabbedpanels1">Datalogic</a></li>
<li><a href="../Sites/third party.html?tab=7#tabbedpanels1">Vensafe</a></li>
<li><a href="../Sites/third party.html?tab=1#tabbedpanels1">Scanners</a></li>
<li><a href="../Sites/third party.html?tab=0#tabbedpanels1">Scales</a></li>
</ul>
</li>
<li class="top"><a href="../Sites/Wincor-Nixdorf materiaal.html" id="WN-Material" class="top_link"><span>WN-Material</span></a></li>
<li class="top"><a href="../Sites/Technician tools.html" id="Techtools" class="top_link"><span>Techtools</span></a></li>
</ul>
</td>
</tr>
</table>
<table width="1038" border="0" cellspacing="1">
<tr>
<td><form method="get" action="../indexer/search.html">
<input type="text" name="zoom_query" size="30" />
<input type="submit" value="Search" />
</form></td>
<td> </td>
<td><div class="clock"><script type="text/javascript" language="javascript" src="../Scripts/datetime.js">
</script></div>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!--ZOOMRESTART-->
<div id="ie6-container-wrap" >
<div id="container">
<!-- TemplateBeginEditable name="EditRegion1" -->
<div id="boven">test<br />
<br />
</div>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">Algemeen</li>
<li class="TabbedPanelsTab" tabindex="0">Tools</li>
<li class="TabbedPanelsTab" tabindex="0">Pc's</li>
<li class="TabbedPanelsTab" tabindex="0">Kassa's</li>
<li class="TabbedPanelsTab" tabindex="0">Selfscanning</li>
<li class="TabbedPanelsTab" tabindex="0">Self Check Outs</li>
<li class="TabbedPanelsTab" tabindex="0">EN andere</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven
<p>Hier wordt de inhoud voor id midden weergegeven</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
<div class="TabbedPanelsContent">
<div class="links">Hier wordt de inhoud voor id left weergegeven</div>
<div class="rechts">Hier wordt de inhoud voor id right weergegeven</div>
<div class="midden">Hier wordt de inhoud voor id midden weergegeven</div>
</div>
</div>
<div class="clearfix:after"> </div>
</div>
<!-- TemplateEndEditable -->
</div>
<div class="clearfix:after"> </div>
</div>
<!--ZOOMSTOP-->
<div id="footer-wrap">
<div id="footer-container">
<div id="footer">
<div id="contentfooter"><div class="leftfooter"><a href="../Sites/Index.html"> <img src="../afbeeldingen/Sitepictures/Homebutton.gif" width="40" height="40" border="none" /></a></div>
<div class="rightfooter"><a href="../Sites/Index.html"> <img src="../afbeeldingen/Sitepictures/mail_button.gif" border="none" /></a></div>RELEASE CANDITATE VERSIE 3 BUILD 27041002 </div>
</div>
</div>
</div>
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab: params.tab ? params.tab : 0});
//-->
</script>
</body>
</html>
PAGE where i open the tabbed panels
<!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"><!-- InstanceBegin template="/Templates/Naamloos-2.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Third Party</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
<link href="../Stijlbladen/main4.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../Stijlbladen/pro_dropdown_3.css"/>
<script src="../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script type="text/javascript" src="../SpryAssets/SpryURLUtils.js"></script>
<script type="text/javascript">var params = Spry.Utils.getLocationParamsAsObject(); </script>
<link href="../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="../Scripts/stuHover.js" type="text/javascript"></script>
<script type="text/javascript" src="../Scripts/percentageProgressBar.js"></script>
<script type="text/javascript" src="../Scripts/paswoord.js"></script>
<!--[if lt IE 7 ]>
<link href="../Stijlbladen/ie6hacks.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>
<!--ZOOMSTOP-->
<div id="header-wrap">
<div id="header-container">
<div id="header">
<div id="header-content">
<table width="890" border="0" cellspacing="1">
<tr>
<td width="100" height="50"><a href="Index.html"><img src="../afbeeldingen/Sitepictures/WN_OriginalImage.jpg" width="90" height="50"/></a></td>
<td width="680">
<span class="preload1"></span>
<span class="preload2"></span>
<ul id="nav">
<li class="top"><a href="#nogo2" id="Algemeen" class="top_link"><span class="down">Algemeen</span></a>
<ul class="sub">
<li><b>Alg. Procedure</b></li>
<li><a href="#nogo3" class="fly">Car Policy</a>
<ul>
<li><a href="../Algemeen/CAR POLICY WN_dec2009.doc">Carpolicy NL</a></li>
<li><a href="../Algemeen/CAR POLICY WNdec2009FR.doc">Carpolicy FR</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">Gsm Policy</a>
<ul>
<li><a href="#nogo8">Gsm Policy NL</a></li>
<li><a href="#nogo9">Gsm Policy FR</a></li>
</ul>
</li>
<li><b>Diversen</b></li>
<li><a href="../Algemeen/Skills.htm">Skills</a></li>
<li><a href="Verlof-Recup.html">Verlof</a></li>
<li><a href="Verlof-Recup.html">Recup</a></li>
</ul>
</li>
<li class="top"><a href="#nogo2" id="Support" class="top_link"><span class="down">Support</span></a>
<ul class="sub">
<li><a href="../Algemeen/support/Artikellijst.xls">ArtikelLijst</a></li>
<li><a href="../Algemeen/support/Retail Algemeen.xls">Retail Algemeen</a></li>
<li><a href="../Algemeen/support/Barcodes v2-2.pdf">Barcode's ALL</a></li>
<li><a href="../Algemeen/support/CRM 2.2.pdf">CRM 2.2</a></li>
<li><a href="#nogo7" class="fly">Onkostennota</a>
<ul>
<li><a href="../Algemeen/dbourdon_1109.xls">Onkostennota NL</a></li>
<li><a href="../Algemeen/décompte de frais July 2009.xls">Onkostennota FR</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">Online Tools</a>
<ul>
<li><a href="file://///Wincor-nixdorf/projects/BE/D34POOL/STOCK MAALBEEK/FIELD/PLOMPEN RETAIL LOC WB.xls">Stock E.Plompen</a></li>
<li><a href="login.html">Online map</a></li>
<li><a href="Fujitsu.html">Fujitsu Portal</a></li>
</ul>
</li>
<li><a href="#nogo7" class="fly">FAX Franchisé</a>
<ul>
<li><a href="../Algemeen/support/Fax franchisé NL4.doc">Franchisé NL</a></li>
<li><a href="../Algemeen/support/Fax franchisé FR4.doc">Franchisé FR</a></li>
</ul>
</li>
</ul>
</li>
<li class="top"><a href="#nogo22" id="Contacts" class="top_link"><span class="down">Contacts</span></a>
<ul class="sub">
<li><a href="../Algemeen/contacts/technician.pdf">Retail Tech</a></li>
<li><a href="../Algemeen/contacts/telretail.xls">Tel Ret/Helpdesk</a></li>
<li><a href="../Algemeen/contacts/Telefoonlijst WN + WNS.xls">Tel WN/WNS</a></li>
</ul>
</li>
<li class="top"><a href="#nogo27" id="Klanten" class="top_link"><span class="down">Klanten</span></a>
<ul class="sub">
<li><a href="Aldi.html">Aldi</a></li>
<li><a href="Little Customers.html?tab=0#tabbedpanels1">Belgique Loisirs</a></li>
<li><a href="Bonita.html">Bonita</a></li>
<li><a href="Carrefour.html">Carrefour</a></li>
<li><a href="C&A.html">C & A</a></li>
<li><a href="Decathlon.html">Decathlon</a></li>
<li><a href="Delhaize.html">Delhaize</a></li>
<li><a href="Ici Paris XL.html">Ici Paris</a></li>
<li><a href="Ikea.html">Ikea</a></li>
<li><a href="Little Customers.html?tab=3#tabbedpanels1">Koodza</a></li>
<li><a href="Kruidvat.html">Kruidvat</a></li>
<li><a href="Lidl.html">Lidl</a></li>
<li><a href="Living Tomorrow.html">Living Tomorrow</a></li>
<li><a href="Mediamarkt.html">Mediamarkt</a></li>
<li><a href="Scapino.html">Scapino</a></li>
<li><a href="Little Customers.html?tab=2#tabbedpanels1">Takko</a></li>
<li><a href="Little Customers.html?tab=1#tabbedpanels1">Texto</a></li>
</ul>
</li>
<li class="top"><a href="#nogo63" id="ThirdParty" class="top_link"><span class="down">3th Party</span></a>
<ul class="sub">
<li><a href="third party.html?tab=5#tabbedpanels1">Fujitsu Siemens</a></li>
<li><a href="third party.html?tab=4#tabbedpanels1">HP</a></li>
<li><a href="third party.html?tab=6#tabbedpanels1">Datalogic</a></li>
<li><a href="third party.html?tab=7#tabbedpanels1">Vensafe</a></li>
<li><a href="third party.html?tab=1#tabbedpanels1">Scanners</a></li>
<li><a href="third party.html?tab=0#tabbedpanels1">Scales</a></li>
</ul>
</li>
<li class="top"><a href="Wincor-Nixdorf materiaal.html" id="WN-Material" class="top_link"><span>WN-Material</span></a></li>
<li class="top"><a href="Technician tools.html" id="Techtools" class="top_link"><span>Techtools</span></a></li>
</ul>
</td>
</tr>
</table>
<table width="1038" border="0" cellspacing="1">
<tr>
<td><form method="get" action="../indexer/search.html">
<input type="text" name="zoom_query" size="30" />
<input type="submit" value="Search" />
</form></td>
<td> </td>
<td><div class="clock"><script type="text/javascript" language="javascript" src="../Scripts/datetime.js">
</script></div>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!--ZOOMRESTART-->
<div id="ie6-container-wrap" >
<div id="container">
<!-- InstanceBeginEditable name="EditRegion1" -->
<div id="boven"><img src="../afbeeldingen/Sitepictures/Datalogic_logo.jpg" alt="Datalogic" name="img2" width="100" height="100" id="img2" /> <img src="../afbeeldingen/Sitepictures/PSC-Logo4C.jpg" alt="PSC" name="img2" width="450" height="160" id="img2" /> <img src="../afbeeldingen/Sitepictures/NCRlogo.jpg" alt="NCR" name="img2" width="116" height="116" id="img2" /> <img src="../afbeeldingen/Sitepictures/symbol-logo.jpg" alt="Symbol" name="img2" width="200" height="150" id="img2" /></div>
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">kassascanners</li>
<li class="TabbedPanelsTab" tabindex="0">Handscanners</li>
<li class="TabbedPanelsTab" tabindex="0">Scales</li>
<li class="TabbedPanelsTab" tabindex="0">Kassaprinters</li>
<li class="TabbedPanelsTab" tabindex="0">HP</li>
<li class="TabbedPanelsTab" tabindex="0">Fujitsu-Siemens</li>
<li class="TabbedPanelsTab" tabindex="0">Datalogic</li>
<li class="TabbedPanelsTab" tabindex="0">Vensafe</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
<div class="TabbedPanelsContent">
<div class="links"></div>
<div class="rechts"></div>
<div class="midden"></div>
</div>
</div>
<div class="clearfix:after"> </div>
</div>
<!-- InstanceEndEditable -->
</div>
<div class="clearfix:after"> </div>
</div>
<!--ZOOMSTOP-->
<div id="footer-wrap">
<div id="footer-container">
<div id="footer">
<div id="contentfooter"><div class="leftfooter"><a href="Index.html"> <img src="../afbeeldingen/Sitepictures/Homebutton.gif" width="40" height="40" border="none" /></a></div>
<div class="rightfooter"><a href="Index.html"> <img src="../afbeeldingen/Sitepictures/mail_button.gif" border="none" /></a></div>RELEASE CANDITATE VERSIE 3 BUILD 27041002 </div>
</div>
</div>
</div>
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab: params.tab ? params.tab : 0});
//-->
</script>
</body>
<!-- InstanceEnd --></html>
TABBED PANELS CSS
@charset "UTF-8";
/* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* Horizontal Tabbed Panels
* The default style for a TabbedPanels widget places all tab buttons
* (left aligned) above the content panel.
/* This is the selector for the main TabbedPanels container. For our
* default style, this container does not contribute anything visually,
* but it is floated left to make sure that any floating or clearing done
* with any of its child elements are contained completely within the
* TabbedPanels container, to minimize any impact or undesireable
* interaction with other floated elements on the page that may be used
* for layout.
* If you want to constrain the width of the TabbedPanels widget, set a
* width on the TabbedPanels container. By default, the TabbedPanels widget
* expands horizontally to fill up available space.
* The name of the class ("TabbedPanels") used in this selector is not
* necessary to make the widget function. You can use any class name you
* want to style the TabbedPanels container.
.TabbedPanels {
width: 1040px; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
position: static;
float: left;
/* This is the selector for the TabGroup. The TabGroup container houses
* all of the tab buttons for each tabbed panel in the widget. This container
* does not contribute anything visually to the look of the widget for our
* default style.
* The name of the class ("TabbedPanelsTabGroup") used in this selector is not
* necessary to make the widget function. You can use any class name you
* want to style the TabGroup container.
.TabbedPanelsTabGroup {
margin: 0px;
padding: 0px;
/* This is the selector for the TabbedPanelsTab. This container houses
* the title for the panel. This is also the tab "button" that the user clicks
* on to activate the corresponding content panel so that it appears on top
* of the other tabbed panels contained in the widget.
* For our default style, each tab is positioned relatively 1 pixel down from
* where it wold normally render. This allows each tab to overlap the content
* panel that renders below it. Each tab is rendered with a 1 pixel bottom
* border that has a color that matches the top border of the current content
* panel. This gives the appearance that the tab is being drawn behind the
* content panel.
* The name of the class ("TabbedPanelsTab") used in this selector is not
* necessary to make the widget function. You can use any class name you want
* to style this tab container.
.TabbedPanelsTab {
position: static;
top: 1px;
float: left;
font: bold 0.7em sans-serif;
background-color: #FF0033;
list-style: none;
border-left: solid 1px #CCC;
border-bottom: solid 1px #999;
border-top: solid 1px #999;
border-right: solid 1px #999;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
margin-top: 0px;
margin-right: 1px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 4px;
padding-right: 5px;
padding-bottom: 4px;
padding-left: 5px;
/* This selector is an example of how to change the appearnce of a tab button
* container as the mouse enters it. The class "TabbedPanelsTabHover" is
* programatically added and removed from the tab element as the mouse enters
* and exits the container.
.TabbedPanelsTabHover {
background-color: #75A7D0;
/* This selector is an example of how to change the appearance of a tab button
* container after the user has clicked on it to activate a content panel.
* The class "TabbedPanelsTabSelected" is programatically added and removed
* from the tab element as the user clicks on the tab button containers in
* the widget.
* As mentioned above, for our default style, tab buttons are positioned
* 1 pixel down from where it would normally render. When the tab button is
* selected, we change its bottom border to match the background color of the
* content panel so that it looks like the tab is part of the content panel.
.TabbedPanelsTabSelected {
border-bottom: 2px solid #EEE;
color: #FFF;
background-color: #000;
/* This selector is an example of how to make a link inside of a tab button
* look like normal text. Users may want to use links inside of a tab button
* so that when it gets focus, the text *inside* the tab button gets a focus
* ring around it, instead of the focus ring around the entire tab.
.TabbedPanelsTab a {
color: black;
text-decoration: none;
/* This is the selector for the ContentGroup. The ContentGroup container houses
* all of the content panels for each tabbed panel in the widget. For our
* default style, this container provides the background color and borders that
* surround the content.
* The name of the class ("TabbedPanelsContentGroup") used in this selector is
* not necessary to make the widget function. You can use any class name you
* want to style the ContentGroup container.
.TabbedPanelsContentGroup {
clear: both;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
float: left;
/* This is the selector for the Content panel. The Content panel holds the
* content for a single tabbed panel. For our default style, this container
* provides some padding, so that the content is not pushed up against the
* widget borders.
* The name of the class ("TabbedPanelsContent") used in this selector is
* not necessary to make the widget function. You can use any class name you
* want to style the Content container.
.TabbedPanelsContent {
padding: 4px;
height: 100%;
width: 1032px;
float: left;
/* This selector is an example of how to change the appearnce of the currently
* active container panel. The class "TabbedPanelsContentVisible" is
* programatically added and removed from the content element as the panel
* is activated/deactivated.
.TabbedPanelsContentVisible {
background-color: #FFF;
/* Vertical Tabbed Panels
* The following rules override some of the default rules above so that the
* TabbedPanels widget renders with its tab buttons along the left side of
* the currently active content panel.
* With the rules defined below, the only change that will have to be made
* to switch a horizontal tabbed panels widget to a vertical tabbed panels
* widget, is to use the "VTabbedPanels" class on the top-level widget
* container element, instead of "TabbedPanels".
/* This selector floats the TabGroup so that the tab buttons it contains
* render to the left of the active content panel. A border is drawn around
* the group container to make it look like a list container.
.VTabbedPanels .TabbedPanelsTabGroup {
float: left;
width: 10em;
height: 20em;
background-color: #CCC;
position: relative;
border-top: solid 1px #999;
border-right: solid 1px #999;
border-left: solid 1px #CCC;
border-bottom: solid 1px #CCC;
/* This selector disables the float property that is placed on each tab button
* by the default TabbedPanelsTab selector rule above. It also draws a bottom
* border for the tab. The tab button will get its left and right border from
* the TabGroup, and its top border from the TabGroup or tab button above it.
.VTabbedPanels .TabbedPanelsTab {
float: none;
margin: 0px;
border-top: none;
border-left: none;
border-right: none;
/* This selector disables the float property that is placed on each tab button
* by the default TabbedPanelsTab selector rule above. It also draws a bottom
* border for the tab. The tab button will get its left and right border from
* the TabGroup, and its top border from the TabGroup or tab button above it.
.VTabbedPanels .TabbedPanelsTabSelected {
background-color: #EEE;
border-bottom: solid 1px #999;
/* This selector floats the content panels for the widget so that they
* render to the right of the tabbed buttons.
.VTabbedPanels .TabbedPanelsContentGroup {
clear: none;
float: left;
padding: 0px;
width: 30em;
height: 20em;added also the css for the menubar
pro_dropdown_3.css
.preload1 {
background-image: url(../afbeeldingen/Sitepictures/three_0a.gif);
.preload2 {
background-image: url(../afbeeldingen/Sitepictures/three_1a.gif);
#nav {
padding:0;
margin:0;
list-style:none;
height:38px;
position:relative;
z-index:500;
font-family:arial, verdana, sans-serif;
background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
background-repeat: repeat-x;
#nav li.top {
display:block;
float:left;
width: auto;
#nav li a.top_link {
display:block;
float:left;
height:35px;
line-height:33px;
color:#ccc;
text-decoration:none;
font-size:11px;
font-weight:bold;
cursor:pointer;
background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
width: 85px;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 2px;
#nav li a.top_link span {
float:left;
display:block;
height:35px;
background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
background-repeat: no-repeat;
background-position: right top;
width: 70px;
padding-top: 0;
padding-right: 10px;
padding-bottom: 0;
padding-left: 10px;
#nav li a.top_link span.down {
float:left;
display:block;
padding:0 10px 0 12px;
height:35px;
background-image: url(../afbeeldingen/Sitepictures/three_0a.gif);
background-repeat: no-repeat;
background-position: right top;
#nav li:hover a.top_link {
color:#fff;
background-image: url(../afbeeldingen/Sitepictures/three_1.gif);
background-repeat: no-repeat;
#nav li:hover a.top_link span {
background-image: url(../afbeeldingen/Sitepictures/three_1.gif);
background-repeat: no-repeat;
background-position: right top;
#nav li:hover a.top_link span.down {
padding-bottom:3px;
background-image: url(../afbeeldingen/Sitepictures/three_1a.gif);
background-repeat: no-repeat;
background-position: right top;
/* Default list styling */
#nav li:hover {position:relative; z-index:200;}
#nav li:hover ul.sub
{left:1px; top:38px; background: #50b5d0; padding:3px; border:1px solid #0b4d97; white-space:nowrap; width:90px; height:auto; z-index:300;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:90px; font-weight:normal;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:88px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #50b5d0;}
#nav li ul.sub li a.fly
background-color: #50b5d0;
background-image: url(../afbeeldingen/Sitepictures/arrow.gif);
background-repeat: no-repeat;
background-position: 80px 6px;
#nav li:hover ul.sub li a:hover
{background:#3f96a9; color:#fff; border-color:#fff;}
#nav li:hover ul.sub li a.fly:hover
color:#fff;
background-color: #3f96a9;
background-image: url(../afbeeldingen/Sitepictures/arrow_over.gif);
background-repeat: no-repeat;
background-position: 80px 6px;
#nav li b {display:block; font-size:11px; height:18px; width:88px; line-height:18px; margin-bottom:3px; text-indent:6px; color:#ff6; border-bottom:1px solid #ff6; cursor:default;}
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:90px; top:-4px; background: #50b5d0; padding:3px; border:1px solid #0b4d97; white-space:nowrap; width:90px; z-index:400; height:auto;}
#nav ul,
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
color:#fff;
border-color:#fff;
background-color: #3f96a9;
background-image: url(../afbeeldingen/Sitepictures/arrow_over.gif);
background-repeat: no-repeat;
background-position: 80px 6px;
#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
color:#000;
border-color:#50b5d0;
background-color: #50b5d0;
background-image: url(../afbeeldingen/Sitepictures/arrow.gif);
background-repeat: no-repeat;
background-position: 80px 6px; -
Spry Collapsible panel works in Safari, Firefox but not in IE 7 and 8
Revising a page and wish to have the Spry Collapsible Panel load "closed". Never used Spry before but is works ok as mentioned but when page is opened in IE the panel is open and stays open. Clicking does not close it.
The panel tab reads "CLICK To See Matched Rail & Stile Set-Up Blocks".
Did I mention I am not a programmer? Thanks for the help.
http://www.mlcswoodworking.com/shopsite_sc/store/html/smarthtml/pages/set_3pc_roundover_co ve.htmjonholcombe wrote:
Did I mention I am not a programmer? Thanks for the help.
Jon,
Not a good way to start. You need to have some basic skills to work on websites. OK, if you want to build a bridge for your toy cars to cross a model railway line, you could probably cope, but to build a bridge in the real world, you need real knowledge.
Having said that, I have pulled all of the relevant code from your page to re-construct the collapsible panel and, although the markup would not be the one I would have gone for, the widget works in all browsers, see the code below. This means that the problem lies elsewhere.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="http://www.mlcswoodworking.com/SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
<link href="http://www.mlcswoodworking.com/SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css">
<style>
#collapsiblepaneltab {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
height: 18px;
width: 645px;
color: #512b05;
text-align: center;
margin-top: 0px;
padding-top: 0px;
line-height: 21px;
font-weight: normal;
</style>
</head>
<body>
<table width="645" border="0">
<tr>
<td><div id="CollapsiblePanel3pcset" class="CollapsiblePanel">
<div class="CollapsiblePanelTab" id="collapsiblepaneltab" tabindex="0"><img src="http://www.mlcswoodworking.com/shopsite_sc/store/html/smarthtml/graphics4/collapsiblepanelarrow102.gif" alt="" width="8" height="8" border="0" /> CLICK To See Matched Rail & Stile Set-Up Blocks</div>
<div class="CollapsiblePanelContent"><table border="1" cellpadding="0" cellspacing="0" width="645">
<tr>
<td colspan="4" align="center" valign="middle" bgcolor=""><font size="1"><font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular" size="2" color="black"><strong>SET-UP BLOCKS FOR MATCHED RAIL AND STILE BITS</strong></font></td>
</tr>
<tr>
<td align="center" valign="middle" bgcolor="#cccc99" width="55"><font size="1"><font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><font color="black"><strong>Item</strong></font></font></font></td>
<td align="center" valign="middle" bgcolor="#cccc99"><font size="1"><font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><font size="2" color="black"><strong>Set-Up Block Profile</strong></font></font></font></td>
<td align="center" valign="middle" bgcolor="#cccc99" width="55"><font size="1"><font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular"><font color="black"><strong>Price</strong></font></font></font></td>
<td align="center" valign="middle" bgcolor="#cccc99" width="58"></td>
</tr>
<tr>
<td align="center" valign="middle" width="55"><font size="1"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular" color="black"><strong>#9745</strong></font></font></td>
<td align="center" valign="middle"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular">Set-Up Block for round over matched rail & stile bits</font></td>
<td align="center" valign="middle" width="55"><font size="1"><font size="2" face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular" color="black"><strong>$9.95</strong></font></font></td>
<td align="center" valign="middle" width="58"><a href="http://www.mlcswoodworking.com/cgi-mlcswoodworking/sb/order.cgi?storeid=*16f8a8beab2fd058071ebc4eb5&dbname=products&sku=%239745&function=add"><font size="2"><img src="../graphics/orderbut.gif" alt="" width="58" height="17" border="0" /></font></a></td>
</tr>
</table>
<script type="text/javascript">
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel3pcset", {contentIsOpen:false});
</script>
</body>
</html>
To help you any further would take me way outside the scope of this forum, but if you were to employ me to untangle the mess, I would start afresh.
Gramps -
Spry Panel State - open/closed ?
Hello Guys/Gals,
I don't want to re-invent the wheel here if at all possible...
Has anyone ever included the Spry Collapsible Panel in menu by PHP Includes?
Here is what I need to accomplish, the spry panels are in 1 file which is included throughout the entire site with php includes.
I need the open/closed state to be remembered - so if you open panel #2 and click a link, you end up on that page with only panel #2 open.
If the user closes that panel, then the panel is closed on any page visited.
Tracking user with cookies or what?
Can someone point me to any example code for this?
Thanks,
RDDoes this help:
http://www.spry-it.com/examples/spry-widget-cookie-history/
http://www.spry-it.com/examples/spry-widget-cookie-history/#collapsiblepanel -
Multiple Spry Collapsible Panels with different Open-Close defaults
Hello,
The site I am working on has a page with (5) Spry collapsable panels. (4) are set default open, (1) is set default closed.
I am trying to get (3) Open, and (2) closed. However, setting a second panels default to closed gives a syntax error.
Anyone know how to make it work, if it can at all?Remove the closing parenthesis after "CollapsiblePanel5". It should be like this:
var CollapsiblePanel5 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel5", {contentIsOpen: false} ); -
Spry Collapsible Panels - Way to set them open only once per visit?
I'm wondering if there is a way to set a Spry Collapsible
Panel to be automatically open on the initial loading of the site,
but as people navigate around the site and back and forth from the
home page, to be able to have it closed on subsequent visits to the
home page.
Right now I have a collapsible panel set to OPEN by default
when someone first hits the home page, but if they navigate around
the site and then click to the home page again, they get the panel
open again. Naturally, that will end up annoying people.
Any suggestions?
Thanks in advance!
SaraFlash local shared object can help with this. Here is some info:
http://www.bestflashanimationsite.com/tutorials/4/
http://www.permadi.com/tutorial/flashSharedObject/index.html
http://www.kirupa.com/developer/mx/sharedobjects.htm
Best wishes,
Adninjastrator -
Spry collapsible panel stays open in Internet Explorer.
I'm trying to use the spry collapsible panel to hide and show inormation, and it will not stay closed. I've used the default closed option in the properties panel, and made sure the eye in design view is closed. Please give some suggestions for correcting this problem.
The out-of-the-box SpryCollapiblePanel works like a charm.
This means that you have altered the HTML, CSS and/or the JS.
Because we are not privy to what you have done, it is not possible to help you find a solution.
I recommend that you upload the site and supply a link to that site. -
How can I make the spry accordion remember the panel open
when I refresh the page or jump to a new page?
I am using the accordion feature on all my pages as a
navigation aid. It has three panels. When you refresh the page the
panel goes back to the default pane... Is there a way of
controlling this so that the browser can remember the pane that is
open (say set a variable, cookie, other?)Look for "Set the default open panel" on the following page:
http://labs.adobe.com/technologies/spry/articles/accordion_overview/index.html
Keep in mind you would need to change that bit of code on
every page. The only way to do it more dynamically would be to
include a custom javascript or PHP/ASP style script in order to
change the value. -
Spry Accordion Panel Default State All Closed?
Is it possible to set a group of Spry accordion panels so
that all are closed by default?Steven_K wrote:
> Is it possible to set a group of Spry accordion panels
so that all are closed by default?
Yes, a Google search for "Spry accordion all closed" brings
up this as
the first result:
http://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample.html
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS3" (friends of
ED)
Author, "PHP Solutions" (friends of ED)
http://foundationphp.com/
Maybe you are looking for
-
Error Screen output without connection to user DYNPRO_SEND_IN_BACKGROUND
Hi Experts I am trying to debbug a BADI (for shc) in SRM 7.0 with external debugger. I placed a breakpoint in the BADI, and logged into the portal screen,it is independent portal. when i start to create the shc i get the error: Screen output w
-
Different Schemas in different environments for same tables used in a Universe
Hi, I have a Universe in Development where I have tables pointed to a schema (DW) in DEV but in TEST/INT I have the same tables under a different schema (TESTDW). So when I promote the Universe & reports from DEV to TEST, I will be getting errors as
-
I have dreamweaver mx 2004. I have create a contact form including a submit button. But can't figure out how to attach an email address to this submit button so that once a viewer hits this submit button, the appropriate will be notified with respect
-
Certificate Based Authentication and SSL
To whom it may concern, I have installed SJES on Solaris 9 x386 (intel version). Everything is running fine, the mails are also coming and going. Now, I need Certificate based authentication and SSL. I have downloaded versign.com trial certificate an
-
Hi All, While inserting the quantity value LOSBS in screen fied that " input value is greater that screen field". How to remove this error? Regards Saurabh.