Collapsible panels to show/hide tr .. /tr ?

Is it possible to have 2 table rows per data record where one
cell in the first tr is the tab and the 2nd tr is the content?
like this
+-----+-------+-------+-----+
| tab | xxxx | yyyy | zzz |
+-----+-------+-------+-----+
|lorem ipsum ceterum |
|censeo Carthaginem |
+------------------------------+
| ...next data record ... |
This structrure is used for each dataset row. I want the
first cell ("tab") to be the clickable tab and the colspanning data
to be the content to hide/show.
Opera 9.5 and FF3 show very strange screen actions ....
Doesn't need to be a table, but <divs> seem to be too
complicated ...
Thanks in advance.
Martin

Thanks for your help, nearly worked but only returned results where the if statement was met ie where locked =0, so I used an additional statement to display something else when when locked=1
<?php
if($row_spec_rx['locked'] == 1) {
echo "button html goes here";
?>
<?php
if($row_spec_rx['locked'] == 0) {
echo "something else";
?>
I am sure there must be a more elegant way of doing this!

Similar Messages

  • Can`t hide link in Collapsible Panel

    Hi all.
    Have one problem. Сan`t realize in Collapsible Panel show/hide function with Close & Hide links.
    http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WS6A1887F2-D97C-48a9-A26C-C311CE4B1F83. html
    Get sample from here-> http://labs.adobe.com/technologies/spry/samples/collapsiblepanel/collapsible_panel_sample. html (Open Panel with Link)
    Sorry for english - hope all write !
    1) Try with Layers - but this layers don`t clinging to necessary place =(
    2) Through <div> tags (apDiv1 - without parametrs (only id))
    a) Out of Collapsible Panel. Сan`t expose in row AP Elements - hidden for "apDiv1". By default this tag is visible & not exposed to hidden-in this panel nothing to change.
    <p><div id="apDiv1"><a href="#" onclick="CollapsiblePanel1.open();MM_showHideLayers('apDiv1','','hide','apDiv2','','show')">Open Panel</a></div>
    -------<div id="apDiv2"><a href="#" onclick="CollapsiblePanel1.close();MM_showHideLayers('apDiv1','','show','apDiv2','','hide')">Close Panel</a></div>
    </p>
    <div id="CollapsiblePanel1" class="CollapsiblePanel">
      <div class="CollapsiblePanelTab"><a href="#">Open Panel with Link </a></div>
      <div class="CollapsiblePanelContent">
        <p>This Collapsible Panel is opened and closed with a link. </p>
      </div>
    </div>
    (And this variant does not make)
    b) Inwardly "CollapsiblePanelTab".But making apDiv1 or apDiv2 hidden - CollapsiblePanelTab is disappears.
    <div id="CollapsiblePanel2" class="CollapsiblePanel">
      <div class="CollapsiblePanelTab"><div id="apDiv1"><a href="#" onclick="CollapsiblePanel2.open();">Open Panel</a></div> | <div id="apDiv2"><a href="#" onclick="CollapsiblePanel2.close();">Close Panel</a></div></div>
      <div class="CollapsiblePanelContent">
        <p>text2</p>
      </div>
    </div>
    3)Show hide links?
    <a href="#" onclick="return toggleMiniToc('minitoc-links', this);" class="hideLink">Hide</a>
    But I d`t understand how to do what!
    What wrong way?

    Hi,
    It is ok to not working the link because like this was
    designed. When you click o a collapsible panel tab, you want to
    open the new tab, not to follow the link if this exist.
    So this behavior was added on purpose. If you want to disable
    this behavior, you should go on th SpryCollapsiblePanel.js file and
    remove the stopPropagation function.
    Diana

  • Iframe doesnt show up in collapsible panel

    I have put a google calendar on a iframe I want to present on
    a collapsible panel. The Iframe doesent show up on firefox when the
    default state of the panel is closed. it works in Safari. Both on
    OS X. There is an errormessage from Fireworks pasted below.
    Is there a way to get the panel to work proper with this
    Iframecontent?
    This works:
    http://www.nuna.no/fabrikken/colpanel_spry_open.html
    This doesent:
    http://www.nuna.no/fabrikken/colpanel_spry_closed.html
    quote:
    uncaught exception: [Exception... "Component returned failure
    code: 0x80004005 (NS_ERROR_FAILURE)
    [nsIDOMNSDocument.getBoxObjectFor]" nsresult: "0x80004005
    (NS_ERROR_FAILURE)" location: "JS frame ::
    http://www.google.com/calendar/d003e2eff7c42eebf779ecbd527f1fe0embedcompiled__no.js
    :: anonymous :: line 134" data: no]
    [Break on this error] undefined
    [Exception... "Component returned failure code: 0x80004005
    (NS_ERROR_FAILURE) [nsIDOMNSDocument.getBoxObjectFor]" nsresult:
    "0x80004005 (NS_ERROR_FAILURE)" location: "JS frame ::
    http://www.google.com/calendar/d003e2eff7c42eebf779ecbd527f1fe0embedcompiled__no.js
    :: anonymous :: line 134" data: no]

    Yes I meant to writethat the errormessages was from Firefox,
    not Fireworks.
    The iframe with the googlekalendar works with both tabbed
    panel and accordion. i dont have Blinds in the de insert menu, but
    I will try later. Anyway, its the collapsible panel I need to use
    because its saves place. ..But so does tha tabbs. I will experiment
    som more with this exiting Sprys. Thnks V1 Fusion :)

  • Show/hide panels on button click

    Hello,
    I have to show/hides several panels on same palette on some button actions. I am trying to check whether it is possible to add each child panel in different .fr files.
    Just to brief,  On panel I have different icon buttons and on each button I have to show different view in the main panel thus I cannot use tabular dialog. Please help me to find a way to achieve this?
    I tried following code
    I have Created two primary resource panel in TestSample1.fr,TestSample2.fr files respctively.
    My main panel (Palette panel) have two buttons (TestSample1Button,TestSample2Button).
    I want to show/hide these panels on button click in main panel.
    InterfacePtr<IPanelControlData> parentPanelCtrlData(Utils<IPalettePanelUtils>()->QueryPanelByWidgetID(kMainPanelWidgetID) ); // main panel
    if(parentPanelCtrlData)
        InterfacePtr<IControlView>         testSample1PanelPanelView((IControlView*)::CreateObject(::GetDataBase(this),kTestSample1P anelWidgetBoss,IID_ICONTROLVIEW));
        if(testSample1PanelPanelView)
            parentPanelCtrlData->AddWidget(testSample1PanelPanelView);
    I have added above code on TestSample1Button observer.But it is not working.
    is It possible? can anybody help me?

    Yes it is possible.
    I am not sure but following line of code also needed after adding widget .
    testSample1PanelPanelView->ForceRedraw(testSample1PanelPanelView->GetDrawRegion(), kTrue);

  • Spry collapsible panel with spry data

    I have created a spry collapsible panel and wanted to put
    srpy data in it, to dynamically load.
    i also want to hide the entire panel if no data is available.
    It will show the data, but the click to open/close does not
    work.
    here is the code.

    I have made some progress, thanks, however im still getting
    some odd formatting issues, for example, the 1st panel shows with
    different design to the rest of the panels.
    this is my code;
    <div id="region" spry:region="ds1">
    <div id="repeat" spry:repeat="ds1">
    <div id="CollapsiblePanel{ds_RowID}"
    class="CollapsiblePanel">
    <div class="CollapsiblePanelTab"
    tabindex="{ds1::ds_RowID}"> <h1>{title} - last amended
    {amended}</h1></div>
    <div
    class="CollapsiblePanelContent"><strong>{message}</strong>
    Added by <strong>{owner}</strong> on
    <strong>{added} </strong>(REF:
    <strong>{id}</strong>) <a href="/service/index.asp"
    target="_self">View full details</a></div>
    </div>
    <script type="text/javascript">
    <!--
    var CollapsiblePanel{ds_RowID} = new
    Spry.Widget.CollapsiblePanel("CollapsiblePanel{ds_RowID}");
    //-->
    </script>
    As you can see, I am inserting {ds_RowID} in the variable
    name, in order for the panels to operate independantly, however
    have I coded it correctly?

  • 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.

  • Spry Collapsible Panel question

    I have a file online that uses a Spry collapsible panel.  It can be viewed here.  It works beautifully.  For one exception.  The logo is supposed to be up some 10 pixels or so.  The CollapsiblePanelTab is occupying the space.
    So I took the CSS for the CollapsiblePanelContent and moved it up 1em <margin-top: -1em;>.  That put my logo where it should be.  Problem is that when I do this the transparent portion of the logo covers most of the "Hide / Show Logo."  It leaves only a sliver of the right of the tab.  This file can be viewed here.
    The logo consists of the image and the bar underneath it.  Yes, I could crop the image down to the central part, making it narrower, but I do want the bar which is wider.  And I want the bar to disappear when the Spry is activated so that rules out having it as a separate image..
    Even better I would like when the panel is open for the "Hide / Show Logo" to be just above the bar.  I tried that and it threw everything out of kilter.
    Any suggestions!  Thank you in advance for any responses.

    Beth,
       Thought of it, did it, didn't work.
       If I remove the logo from the HTML of the page and instead place it in the "background-image" of the CollapsiblePanelContent CSS I get disastrous results.  The panel collapses (because there is nothing in the DIV) and the CSS placed background image disappears.  Following this thread of thought I could try a much narrower transparent image with nothing in it, just the transparency, and see how that might work.  This would keep the DIV open to the desired height.  Then I could place the actual, true image in the "background-image" of the DIV CSS.
       For the moment I am going to see if someone perhaps comes up with a solution other than this.  The chief reason is that I would lose my dynamic linking of the PSD to the placed image.  This file will be a template of thousands of pages spanning many years so the logo will change appropriately.
       This method, of using the image in the CSS itself, also causes some alignment problems within the DIV.  My background-image does not center properly.  It does so when placed in the HTML of the document.
       Getting back to the original problem, which seems to be the transparency of the image and its width, I don't see any reason why I could not break my image into two pieces and place each one within the CollapsiblePanelContent.  Each image in their own DIV contained within the panel content.  I could then make the logo part separate from the bar but still have the bar collapse.  The logo portion could then be much narrower.  I think I will try this method and see what transpires.  I could then keep my dynamically linked images.  Theoretically!!!
       Thanks for letting me bounce ideas off a fellow thick skull.  Not seeing the trees for the forest and all that.
    Regards,
    Wayne

  • How do I place external content in a Collapsible Panel

    I figured out how to add a tooltip to a collapsible panel
    today, but I am having trouble getting content to load in the
    content portion of the panel from another HTML file.
    I have created a loader.gif animation that I would also like
    to appear in the content panel while the content is loading.
    This, like the tooltips, is way above my skill level and any
    help would be appreciated. I am starting from using Spry 1.6's
    built in features in Dreamweaver CS3 and trying to expand on them
    with help using the other spry js found here in the Labs.
    Link to
    collapsible panel page I am working on
    Currently I have all the content panel text in panels. I
    would like to copy the content to another file so it can load only
    when the panel tab is opened.

    Check out this example.
    http://labs.adobe.com/technologies/spry/samples/utils/update_content.html
    its about updateContent which allows u to place content in
    your div.
    U could create a little function for it to load content in
    your divs.
    Example of load indicator + function setup:
    the indicator div
    <div id="indicatorMessageBoxId"><img
    scr="imagehere.gif" /> Please wait loading content </div>
    The function (place in <script> tags and place it in
    header (dont forget to include SpryData.js)
    function updateContent(ele,url){
    //U call this by using the command:
    updateContent('ID_toLoad_contentIn',url_of_new_content');
    document.getElementById('indicatorMessageBoxId').style.display =
    ""; //this will show the indicator loadimage box
    Spry.Utils.updateContent(ele, url, function() {
    document.getElementById('indicatorMessageBoxId').style.display =
    "none"; }); //this will hide the box when loading file is done
    u can attach this function on your collapspannel by adding a
    onclick="updateContent('myId','data/page.html');" to the
    element.
    Hope this helps :)

  • Expand or collapse all collapsible panels at once.

    Hi,
    I have a page with a number of collapsible panels on it generated from SpryData.
    I know the collapsible panel names because their IDs are generated from the Spry data with
    <div class="CollapsiblePanel" id="cp{ds_RowNumber}" spry:repeat="Events">
    I have a couple of links on the page that I want our members to be able to click to be be able to collapse or expand all collapsible panels at once. How can I return a reference to the collapsible panel objects so I can close / open them using the open / close functions of the widget etc?
    See http://www.thehmc.co.uk/Events4.html and the links with the text (Show or hide all event details)
    i.e. I have a function and I know Spry.$$ is not what I want , but what do I need to return the object reference?
    function dhide()
    var panelCount = Events.getRowCount();
    for (var p = 0;p < panelCount;p++)
      panelID = '#cp' + p;
      var mypanel = Spry.$$(panelID);
      var a = panelID.close();
    Thanks
    Phiol

    Hi,
    Yes I found CollapsiblePanelGroup in the Spry 1.6.1 samples and am now using the OpenAllPanels function.
    Finding the collapsible panel group API in the documentation isn't the most intuitive and you may wish to review.
    Regards
    Phil

  • Jqzoom widget inside spry collapsible panel

    I am attempting to place the jqzoom widget inside a spry collapsible panel. The wodget works fine in the html page created for it but will not work in the collapsible oanel page. I believe all documents are in the appropriate folder.
    Here is the code for the page:
    <!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>Untitled Document</title>
    <link href="twoColFixLtHdr.css" rel="stylesheet" type="text/css" />
    <LINK rel=stylesheet type=text/css href="css/jquery.jqzoom.css">
    <style type="text/css">
    #leftbox {
    float: left;
    width: 70%;
    margin-left: 5px;
    #rightbox {
    float: right;
    width: 25%;
    </style>
    <script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
    <script src="js/jquery-1.3.2.js" type="text/javascript"></script>
    <script src="js/jquery.jqzoom1.0.1.js" type="text/javascript"></script>
    <style type="text/css">
    a:hover {
    color: #C36;
    a:active {
    color: #999;
    #wrapper #outsideedgewrapper #outsidebox .container .content #CollapsiblePanel1 .CollapsiblePanelTab strong {
    text-align: left;
    #wrapper #outsideedgewrapper #outsidebox .container .content p strong {
    color: #333;
    #wrapper #outsideedgewrapper #outsidebox .container .content p {
    color: #000;
    #topofpage {
    width: 100px;
    font-size: small;
    float: right;
    </style>
    <link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_goToURL() { //v3.0
      var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
      for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    </script>
    <style type="text/css">
    a:visited {
    color: #333;
    a:hover {
    color: #C36;
    a:active {
    color: #999;
    .outsidebox {
    width: 1120px;
    margin-right: auto;
    margin-left: auto;
    background-repeat: no-repeat;
    background-position: left 90px;
    </style>
    <script src="javascript/jquery-1.4.3.min.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryTooltip.js" type="text/javascript"></script>
    <style type="text/css">
    </style>
    <link href="SpryAssets/SpryTooltip.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    h2 {
    font-size: x-large;
    #wrapper #outsideedgewrapper #outsidebox .container .footer h5 a {
    text-align: center;
    #wrapper #outsideedgewrapper #outsidebox .container .footer h5 a {
    </style>
    <link href="2LinkColor.css" rel="stylesheet" type="text/css" />
    <link href="css/jqzoom.css" rel="stylesheet" type="text/css" />
    <script type="text/xml">
    <!--
    <oa:widgets>
      <oa:widget wid="2148522" binding="#iridology2" />
    </oa:widgets>
    -->
    </script>
    </head>
    <body>
    <div id="wrapper">
      <div id="outsideedgewrapper">
        <div class="outsidebox" id="outsidebox">
          <div class="container">
            <div class="header"><!-- end .header -->
              <p><em><a name="topofpage" id="topofpage"></a></em></p>
    <p> </p>
              <p> </p>
              <p> </p>
              <p><br />
                <br />
              </p>
            </div>
             <div class="sidebar1">
              <p> </p>
              <ul class="nav">
                <li><a href="index.html"><strong>Home</strong></a></li>
                <li><a href="PDf/GAIL SMOLINSKIS EDUCATION - 2010.pdf" target="_new"><strong>Dr. Gail's Education &amp; Credentials(Pdf )</strong></a></li>
    <li><a href="philosophyofregeneration.html"><strong>Sunrider Philosophy of Regeneration&#8482;</strong></a></li>
                <li><a href="Homeopathy.html"><strong>Homeopathy</strong></a></li>
                <li><a href="LowIntensitylasertherapy.html" target="_new"><strong> Low Intensity Laser Therapy</strong></a></li>
              </ul>
    <strong>Dr. Gail Smolinski, DNM®</strong><br />
               Doctorate of Natural Medicine®<br />
               <br />
               Email<br />
               <a href="mailto:[email protected]" class="sidebarlinkcolor">[email protected]</a> <br />
               <br />
               <span class="white"><strong>PH:306-783-1261</strong></span><br />
               Fax:
               306-783-2450<br />
               Box 1625<br />
               Yorkton, SK<br />
               S3N 3L2<br />
      <br />
               <strong>Clinic Hours</strong><br />
               Monday - Friday<br />
               9am - 6pm
               <br />
               <br />
               <span id="sprytrigger1"><strong>Coming Events</strong></span><br/>
              </p>
            </div>
            <!-- end .sidebar1 --></p>
            <div class="content">
              <div>
                <h2>An Ounce of Prevention Natural Health Center</h2>
              </div>
              <div id="rightbox"><img src="images/gaigrey3.jpg" width="186" height="295" align="top" id="Image2" /></div>
              <p><em>&quot;The doctor of the future will give no medicine, but will interest her or his patients in the care of the human frame, in a proper diet, and in the cause and prevention of disease.&quot;<br />
              Thomas A. Edison  (1847 - 1931)</em></p>
              <p>Dr.  Gail Smolinski, a <span class="focusedtext">Doctor of Natural Medicine</span>, has a natural  health clinic at Yorkton, Saskatchewan.       
              </p>
              <p>Dr. Gail  Smolinski is a member in good standing of the <br />
              <span class="focusedtext">Examining Board of Natural Practitioners of Canada</span> (EBNMP) <a href="http://www.ebnmp.com" title="http://www.ebnmp.com/" target="_blank"><strong>www.ebnmp.com</strong></a>,  the <span class="focusedtext">Saskatchewan Association of Doctors  of Natural Medicine (SADNM) </span><a href="http://www.sadnm.com/" title="http://www.sadnm.com/" target="_blank"><strong>www.sadnm.com </strong></a>and the <span class="focusedtext">International Organization of Nutritional  Consultants</span> (IONC) <a href="http://www.ionc.org" title="http://www.ionc.org/" target="_blank"><strong>www.ionc.org</strong></a></p>
              <p>Doctors of  Natural Medicine utilize treatments and lifestyle changes that facilitate the  natural healing process, recognizing the inherent self-healing process in every  person.<em> <a href="http://www.sadnm.com/" target="_new"><strong>More information....</strong></a></em></p>
              <p>In her natural  health clinic, Dr. Gail offers individual health consultations, Low Intensity  Laser Therapy, detoxification foot baths and bio-energetic therapies, as well  as a wide variety of professional health products.</p>
              <p>Dr. Gail has her <span class="focusedtext">Doctor of  Naturopathy</span> degree and is <span class="focusedtext">B</span><strong><span class="focusedtext">oard Certified in both Traditional Naturopathy and  Nutritional Wellness</span>.</strong></p>
              <p>She is a <span class="focusedtext">certified Low  Intensity Laser Therapist</span>, offering patients safe and effective Low  Intensity Laser therapy for soft tissue and sports injuries, wound healing,  dermatological conditions and a variety of musculoskeletal problems. <a href="http://www.bioflexlaser.com/patients/" target="_new"><strong><em>More  information...</em></strong></a></p>
              <p>She is a <span class="focusedtext">Master Herbalist</span>, specializing in Sunrider  Chinese food grade herbs which promote regeneration of the body. Dr. Gail also  utilizes Gemmotherapy and Aromatherapy.       </p>
              <p>Dr. Gail is also a Registered Nutritional Consultant,  a professional <span class="focusedtext">Homeopath</span> and a <span class="focusedtext">Holistic  Iridologist</span>. </p>
              <p>Her bi-weekly column <span class="CollapsiblePanelClosed"><em>&ldquo;An Ounce of Prevention&rdquo;</em></span> can be  found in the <em>&ldquo;News Review Extra&rdquo; </em>and the <em>&quot;Northeast Chronicle&quot;</em>. </p>
              <p>Dr. Gail is also available  for <span class="focusedtext">public  speaking</span> engagements. She has been the keynote speaker for many  groups, specializing  in topics that address <span class="focusedtext">the body</span> (health and nutrition), <span class="focusedtext">the mind</span> (motivational speaking) and <span class="focusedtext">the  spirit</span> (sharing her Bible-based faith). </p>
              <p><strong>CLINIC SERVICES</strong></p>
              <p>Dr. Gail is  available for individual health consultations by appointment. She does  nutritional assessments, as well as iridology and homeopathy. Dr. Gail's professional supplements include herbal and homeopathic formulas, Gemmotherapy remedies and therapeutic grade essential oils. She also offers   detoxification footbaths to reduce the load of toxins in the body.</p>
              <p>Although an  in-clinic visit is the most effective, Dr. Gail can also help people who cannot  travel to see her, due to long distances or poor health. In these cases, she  offers telephone assessments to create an appropriate custom-made individual  health program, which is suited to the patient’s particular needs. The required  health supplements can be mailed or shipped by bus, if necessary. </p>
              <p>Gift Certificates are also available.</p>
              <p><strong>FREQUENTLY ASKED QUESTIONS</strong></p>
              <div id="CollapsiblePanel1" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><a name="panel1" id="panel1"></a><img src="images/arrow.gif" width="30" height="23" hspace="8" />Can you explain what Homeopathy is all about?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p><br />
                    <br />
                  </p>
                  <p>Homeopathy is a  wonderful system of natural medicine which is safe, non-toxic and effective. It  is so safe that expectant mothers and newborn babies can use it, except for a  few specific remedies. </p>
      <p>A homeopathic  remedy contains a very minutely diluted dose of the original medicinal  ingredient, and that is why it is so safe. The higher potencies of a remedy do  not even have any of the original substance in them, only the memory or energy  from it. The purpose of a homeopathic remedy is to give specific information to  the body. Then, the body can use this information to heal and repair.</p>
                  <p>A homeopathic  remedy can be selected <em>according to the  symptoms</em>. It can also be selected <em>according  to the patient’s constitution</em>, which considers many factors about an  individual. </p>
                  <p>Food preferences,  general features, personality and temperament, such as whether he wants to be  left alone or comforted when he does not feel well, what makes his symptoms  better and what makes them worse, even a person’s fears, are considered,  because they are all part of who that unique individual is. A person’s  constitutional remedy will help him with a lot of different symptoms, because  it was selected especially for him.</p>
                  <p>I would not want to be without homeopathic  remedies. You can take them as required, without  worrying about side effects. They can make your life so much more comfortable.  They can be used to stimulate your immune system, so that, eventually, you do  not require them as often, if at all. For example, during allergy season,  people can get a lot of relief from homeopathic formulas for allergies.<br clear="all" />
                  </p>
                  <p>Homeopathic  medicine can also help with mental and emotional symptoms, not only physical  problems. For example, homeopathic remedies can be helpful for those who are  anxious, depressed or even grieving.    <br />
                  <a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel1.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
                  <p> </p>
                </div> 
              </div>
              <div id="CollapsiblePanel2" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" />What is Gemmotherapy?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p> </p>
                  <p> </p>
                  <p>Gemmotherapy is a branch of phytotherapy (therapy from   plants) that uses freshly- picked buds and young shoots from organic trees and   shrubs to make natural remedies. They are carefully stabilized at harvest to   ensure that no vitamins, minerals, natural plant hormones or nucleic acids are   lost. These remedies are full of the energy and therapeutic properties of the   buds.  They are meticulously prepared in a solution of water, alcohol and   glycerine to extract all their beneficial attributes. </p>
                  <p><a href="#" class="closepanelbutton" onclick="CollapsiblePanel2.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
                </div>
              </div>
              <div id="CollapsiblePanel7" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" />Why is Gemmotherapy so effective?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p> </p>
                  <p>Gemmotherapy is highly effective because the buds and young   shoots contain all the genetic information of the future plant. Since they are   extracts of developing tissues, gemmotherapy remedies combine the properties of   the whole plant, including the flowers, the leaves, the fruits, the sapwood and   the rootlets. Extensive research and clinical studies have been carried out to   identify the properties of different buds and to determine the conditions for   which each one is best used.</p>
                  <p>This explains the wide range of applications and   effectiveness of Gemmotherapy remedies for all ages.</p>
                  <p><a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel7.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
                </div>
              </div>
      <div id="CollapsiblePanel3" class="CollapsiblePanel">
        <div class="CollapsiblePanelTab" tabindex="0">
          <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" id="Image1" />What is Iridology and how does it work?</strong></p>
          </div>
        <div class="CollapsiblePanelContent">
          <p><br />
            <br />
            Iridology is a  fascinating natural tool of health assessment. The more I do iridology, the  more accurate I see that it is!</p>
          <p>Iridology involves  looking into a person’s eyes with a light and magnifying lens. I can do a  health assessment by looking into the colored part of the eyes, which is called  the iris. </p>
          <p>In iridology,  there is a map of the iris, which corresponds to the different organs and      </p>
          <p>structures of the body. Iridology Chart <span class="jqZoomWindow"><a href="jquery-ui-1.7.2/images/BIG_IMAGE.jpg"  title="Iridology" class="iridology2">
            <script type="text/javascript">
    // BeginOAWidget_Instance_2148522: #iridology2
    $(document).ready(function(){
          var options ={
          zoomType: 'standard',
          zoomWidth: 200, 
          zoomHeight: 200,
          xOffset: 10,
          yOffset: 0,
          position: "left" ,
          lens:true,
          lensReset : false,
          imageOpacity: 0.2,
          title : false,
          alwaysOn: false,
          showEffect: 'show',
          hideEffect: 'hide',
          fadeinSpeed: 'medium',
          fadeoutSpeed: 'medium',
          preloadImages :true,
          showPreload: true,
          preloadText : 'Loading zoom',
          preloadPosition : 'center'
          $(".iridology2").jqzoom(options);
    // EndOAWidget_Instance_2148522
            </script>
            <img src="jquery-ui-1.7.2/images/SMALL_IMAGE.jpg" align="left" title="Iridology" /> </a></span>
            <script type="text/javascript">
    // BeginOAWidget_Instance_2148522: #iridology2
    $(document).ready(function(){
          var options ={
          zoomType: 'standard',
          zoomWidth: 200, 
          zoomHeight: 200,
          xOffset: 10,
          yOffset: 0,
          position: "left" ,
          lens:true,
          lensReset : false,
          imageOpacity: 0.2,
          title : true,
          alwaysOn: false,
          showEffect: 'show',
          hideEffect: 'hide',
          fadeinSpeed: 'medium',
          fadeoutSpeed: 'medium',
          preloadImages :true,
          showPreload: true,
          preloadText : 'Loading zoom',
          preloadPosition : 'center'
          $(".iridology2").jqzoom(options);    
    // EndOAWidget_Instance_2148522
            </script>
            </a></p>
    <p><br />
      <br />
      </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p><br />
      <br />
      <br />
      It can be used to  help determine problem areas in the body, which may have been acquired  genetically. It can also be used to identify areas of congestion and  environmental toxins that have accumulated in the body since birth, such as  liver or kidney toxins. </p>
          <p>For instance, one  of my clients was having continual problems with a sluggish bowel, which was  not improving in spite of my health recommendations for her colon. When I did  an iridology assessment for her, though, I discovered that the problem was  originating in the small intestine. I adjusted her health program accordingly,  and she did much better after that!<br />
            <br />
            <a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel3.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
          </p>
          </div>
      </div>
              <div id="CollapsiblePanel4" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" />Can Iridology be used preventatively?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p><br />
                    <br />
                  Absolutely! It can  be very valuable for prevention! Let’s say that you are in a canoe, enjoying a  relaxing, peaceful ride down a calm, scenic river on a beautiful summer day.  Meanwhile, I am riding in an airplane, just above the same river, and I can  spot you in your canoe. </p>
                  <p>However, I can  also see that, around the next bend, there is a set of swirling rapids and a  very steep, dangerous waterfall. </p>
                  <p>You have no idea of what you are headed for, but  I can warn you. Fortunately, since we both have cell phones, I can call you  immediately, to warn you of the imminent danger.  You can decide then to pull onto the shore, and check out the rapids before  deciding whether or not to proceed. Or you can decide to turn the canoe around,  and head back the other way. You can also choose to ignore me, of course, but,  no matter what you choose, you will have been warned!</p>
      <p>In Iridology, for  instance, if I see that a person has a congested or toxic bowel, I can advise  him to do a colon cleanse. <a href="PDf/EYE SPY.pdf" target="_new">More information</a><br />
        <a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel4.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
      <p> </p>
                </div>
              </div>
              <div id="CollapsiblePanel5" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" />How do you combine the different therapies to help patients?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p><br />
                    <br />
                    <br />
                  That’s certainly part  of what makes my approach so effective! I can use Iridology to help pinpoint  the specific problems. Homeopathy and nutrition can be used as assessment tools  as well. It’s like having more than one tool in your tool kit. The more  professional tools one has, the better. </p>
                  <p>This allows me to  create an individualized health plan that incorporates different resources,  including nutritional supplements, essential oils, gemmotherapy formulas and homeopathic  remedies, as required. It is ideal to support the body on 3 different levels -  at the nutritional level, at the cellular level, and at the energetic level.</p>
                  <blockquote>
                    <p><a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel5.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
                    <p> </p>
                  </blockquote>
                </div>
              </div>
              <div id="CollapsiblePanel6" class="CollapsiblePanel">
                <div class="CollapsiblePanelTab" tabindex="0">
                  <p><strong><img src="images/arrow.gif" alt="" width="30" height="23" hspace="8" />Can you give me an analogy to compare our health to?</strong></p>
                </div>
                <div class="CollapsiblePanelContent">
                  <p><br />
                    <br />
                  Sure! Think of  your car. It won’t get you to your destination if you don’t have enough fuel to  get there. And it can’t be polluted fuel or watered down fuel, because that’s  just asking for trouble. Your fuel has to have the right octane rating. </p>
                  <p>Your body is like  a car; it’s your go-mobile! If you don’t supply it with the right fuel  (nutrition),you will lose your  get-up-and-go! When you nourish your body properly, you will naturally tend to  have more energy.  </p>
      <p>Even so, you can  fuel up your car with good quality fuel, but if the fuel pump needs repair,  then it’s still not going to work properly for you. If you have a body part  that needs repair, homeopathy can help. </p>
                  <p>We also give our  cars an oil change on a regular basis. Similarly, we can cleanse, regularly, to  clear out our organs, such as the liver, the kidneys, the skin and the  intestines, of toxins that accumulate over time.</p>
                  <p>We can also use  homeopathic formulas to clean out the receptors of the cells in our bodies,  which is where toxic residues can accumulate. Then, our go-mobiles can run more  efficiently! </p>
                  <p>There is one difference, though. We can trade in  our car, when it gets old and worn out. But, we cannot trade in our bodies! We  get one only, and it needs to last us a lifetime! So we  need to take care of it the best we can! <br />
                    <br />
                  <a href="#panel1" class="closepanelbutton" onclick="CollapsiblePanel6.close();MM_goToURL('parent','#panel1');return document.MM_returnValue">Close Panel</a></p>
                  <p> </p>
                </div>
                <strong><br />
              </strong></div>
      <p><strong>    PATIENT TESTIMONIALS</strong></p>
              <table width="90%" border="0" align="center" cellpadding="10">
                <tr>
                  <td><h5><em>...My acquaintance with Dr. Gail Smolinski happened in two ways. First, through her bi-weekly news column, &quot;An Ounce of Prevention&quot; in the News Review Extra: giving information on healthful living and explaining how our amazing bodies work. Dr. Gail's smiling photo also introduced her to me.
                    My by-mail purchase of a flu kit from Dr. Gail protected me from contracting any of the flu bugs making the rounds this winter. Thanks, Dr. Gail! <br />
                    My second acquaintance with Dr. Gail was a visit to her natural health clinic for treatments. Her smile is sunny and real! She introduced me to homeopathic remedies and the impressive Quantum Biofeedback machine. Dr. Gail is a very encouraging caregiver. I am very pleased to have much-improved  Health and I've also gained a new friend! </em></h5>
                    <h5><em>Sincerely, Shirley L. </em>              _______________________________________________________________</h5>
      <h5><em>...Hi! My name  is Carol. I have IBS (Irritable Bowel Syndrome). IBS controlled my life.</em></h5>
                    <h5><em>Before I  went to Dr. Gail Smolinski, I could not work, go shopping or do things with my  family. But I got mad and took control of the IBS!</em></h5>
                    <h5><em>I called Dr.  Gail Smolinski, DNM. We sat down and we talked about how I felt. She gave me  some natural medicine. I have been on this for about 5 months.</em></h5>
                    <h5><em>I feel so  good about the things I got. The natural medicine has helped me out a lot. I  can go to work without looking for the bathrooms. I can do the things I was  afraid to do! I feel like I’m alive!</em></h5>
                  <h5><em>I went to my  doctor, and it seems they couldn’t help. But Dr. Gail Smolinski helped me.  Thank you, Dr. Gail!  </em></h5></td>
                </tr>
              </table>
              <p> </p>
              <h5 class="fltrt"><a href="#topofpage">Top of Page</a><br />
              <!-- end .content -->        </h5>
            </div>
            <script type="text/javascript">
    var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false, enableAnimation:false});
    var CollapsiblePanel3 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel3", {contentIsOpen:false});
    var CollapsiblePanel4 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel4", {contentIsOpen:false});
    var CollapsiblePanel5 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel5", {contentIsOpen:false});
    var CollapsiblePanel6 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel6", {contentIsOpen:false, enableAnimation:false});
    var CollapsiblePanel2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel2", {contentIsOpen:false, enableAnimation:false});
    var CollapsiblePanel7 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel7", {contentIsOpen:false});
            </script>
            <div class="footer">
              <h5 class="footer">Web Design by<a href="http://www.pixelsandpaper.com"> Pixels &amp; Paper Web Design </a><br />
    Copyright © 2011 An Ounce of Prevention Natural Health Center - All rights reserved <!-- end #footer -->
              </h5>
              <!-- end .footer --></div>
            <!-- end .container --></div>
        </div>
      </div>
    </div>
    <div class="tooltipContent" id="sprytooltip1">Meet Dr. Gail for a mini Iridology Session at the Grain Miller's Harvest Showdown in Yorkton, SK - Gallagher Centre- Flexihall - Nov. 2 (4pm to 7:30 pm), Nov. 3,4,5 (1pm to 7:30 pm) </div>
    <script type="text/javascript">
    var sprytooltip1 = new Spry.Widget.Tooltip("sprytooltip1", "#sprytrigger1");
    </script>
    </body>
    </html>

    With the exeption of images, to add external content to a document you will need to make use of either serverside or clientside code.
    Have a look at the SpryHTMLPanel here http://labs.adobe.com/technologies/spry/samples/htmlpanel/html_panel_sample.html
    Otherwise, please supply a link to your site so that we can come up with alternatives.
    Gramps

  • Collapsible Panels - Links to open one, and close others

    Hi,
    I am new to Dreamweaver and have been creating my site by
    learning as I go along. I have already read through all the other
    related topics associated with Collapsible Panels on this blog and
    have still not found an answer. I have been able to open and close
    Collapsible Panels by using links - but unfortunately, I need more
    than just opening and closing.
    On my site i have approximately 5 pages, all with the same
    header and Menu bar. The Information (that i have presented in
    numerous Collapsible Panels) does however vary from page to page.
    What I need to try and figure out is:
    How can I open one collapsible panel and close all others? I
    have seen the one example which leads to my next question:
    How can I group Panels? Some examples of how to open one and
    close all others use this grouping. Is there any other way of
    opening one and closing all others without grouping?
    Lastly, is it possible to set up a link that can be viewed on
    one page which when clicked opens the relevant page and collapsible
    panel? i.e. on my About Us page there is a link (using the Menu
    bar) for one of my several services on the services drop down menu
    (but services is on a different page with the same setup). When a
    viewer clicks on the specific service, is it possible to get the
    site to open the services page, and open the relevant collapsible
    panel (with all other Panels closed)?
    Any assistance would be greatly appreciated - I have been
    searching for days now and cannot seem to find any
    answers/directions in laymans terms.
    Kind regards,
    John

    wlsjoh013 wrote:
    > Hi,
    >
    > I am new to Dreamweaver and have been creating my site
    by learning as I go
    > along. I have already read through all the other related
    topics associated
    > with Collapsible Panels on this blog and have still not
    found an answer. I
    > have been able to open and close Collapsible Panels by
    using links - but
    > unfortunately, I need more than just opening and
    closing.
    >
    > On my site i have approximately 5 pages, all with the
    same header and Menu
    > bar. The Information (that i have presented in numerous
    Collapsible Panels)
    > does however vary from page to page. What I need to try
    and figure out is:
    >
    > How can I open one collapsible panel and close all
    others? I have seen the one
    > example which leads to my next question:
    This page has an example that has a link that can open and
    close a panel:
    http://labs.adobe.com/technologies/spry/samples/collapsiblepanel/collapsible_panel_sample. htm
    One way to do this would be to have a single link that would
    open one of your panels using the code, but then add to it code
    that closes each of the other panels, for example:
    <a href="#"
    onclick="CollapsiblePanel4.open();CollapsiblePanel5.close();CollapsiblePanel6.close();">O pen
    4, close 5 and 6</a>
    To make this work, you'll need to look that the panel
    constructors at the bottom of your page and make sure to match up
    the panel variable names i.e. "var CollapsiblePanel1 =...." the
    variable is CollapsiblePanel1.
    You could also write a function that gathers together the
    various panels you have on the page and then pass to it only the
    panel that you want kept open. For now, though, it might be best to
    use the above method, given your expertise. And taking that even
    further, you could apply the function call unobtrusively. Both the
    function call and the unobtrusive part you can work on later to get
    this working for now.
    > How can I group Panels? Some examples of how to open one
    and close all others
    > use this grouping. Is there any other way of opening one
    and closing all
    > others without grouping?
    This is a little confusing, on one hand you ask about how to
    group, but then ask how not to group. There is a concept of a
    collapsible panel group:
    http://labs.adobe.com/technologies/spry/samples/collapsiblepanel/CollapsiblePanelGroupSamp le.html
    But there is another type of group, that may be more what
    you're looking for, and that's an Accordion panel, which is similar
    to the collapsible panel group, with the exception that it can only
    have one panel open at a time.
    > Lastly, is it possible to set up a link that can be
    viewed on one page which
    > when clicked opens the relevant page and collapsible
    panel? i.e. on my About Us
    > page there is a link (using the Menu bar) for one of my
    several services on the
    > services drop down menu (but services is on a different
    page with the same
    > setup). When a viewer clicks on the specific service, is
    it possible to get
    > the site to open the services page, and open the
    relevant collapsible panel
    > (with all other Panels closed)?
    Probably the easiest way to do this particular one would be
    to make sure that you have all of the panels set to be closed when
    the page loads, and then take a look at the code for the last
    example on this page:
    http://labs.adobe.com/technologies/spry/samples/utils/URLUtilsSample.html
    That example uses a tabbed panel, but the concept is the
    same, use a URL parameter to determine what to show. You'll need to
    link in the SpryURLUtils file in the Spry download package (look in
    the includes folder):
    http://labs.adobe.com/technologies/spry/home.html
    Essentially, your link will look similar to:
    sample.html?panel=1
    Then your code could look something like:
    var params = Spry.Utils.getLocationParamsAsObject();
    var CollapsiblePanel1 = new
    Spry.Widget.CollapsiblePanel("CollapsiblePanel1",
    {contentIsOpen:(params.panel==1 )} );
    var CollapsiblePanel2 = new
    Spry.Widget.CollapsiblePanel("CollapsiblePanel2",
    {contentIsOpen:(params.panel==2 )} );
    Basically what this is doing is creating an object from the
    URL parameters. Then for each of the panels the constructor has
    code that determines whether or not to expand the panel when the
    page loads. So it checks the value of params.panel to see if it
    matches 1 (for the first one), if it does, then that means that
    contentIsOpen is set to true, if it is some other number or is not
    present at all, then that means that the panel is closed. This
    would then be repeated down the line for how ever many panels you
    want to operate like that.
    Danilo Celic
    |
    http://blog.extensioneering.com/
    | WebAssist Extensioneer
    | Adobe Community Expert

  • Google map inside the spry collapsible panel

    So this time I've bumped into interesting 'bug'. I've placed the google map inside the spry collapsible panel. Panel is set to the closed mode on load of page. When I open the tab, map appears, but address marker is hidden behind the top left corner. If I place the same map outside the collapsiple panel it renders all well.
    So my  question is whether there is any way around this issue. When I know where the marker is hidden I can simply move the map and see it, but customer who's not aware of the problem will see only blank map with not marked address which is not acceptable.
    cheers,
    Simon

    Sure mate. Here you go:
    <div id="CollapsiblePanel1" class="CollapsiblePanel">
                  <div class="CollapsiblePanelTab" tabindex="0">SHOW MAP</div>
                  <div class="CollapsiblePanelContent">
                  <cfmap  width="242" height="200" zoomlevel="12" name="mainMap" markercolor="333444" showscale="false"
    typecontrol="none"  showcentermarker="true" centeraddress="#get_event.event_address1#, #get_event.event_address2#, #get_event.event_city#,#get_event.event_county#, #get_event.event_postcode#, #get_event.event_country#  "
    ></cfmap>
                  </div>
                </div>
    And this bit goes at the bottom of the code :
    <script type="text/javascript">
    var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
      </script>
    And that would be the preview that I get once the panel is open:
    And that is the preview of how it should look:
    As you can see the map marker sticks to the top left corner. I was wondering whether there is any way to re-focus it once the panel is open.
    cheers,
    Simon

  • Why is my Spry Collapsible Panel not working in IE

    I have created a very very simple website, in dutch (i'm dutch). http://www.dgvastgoed.nl
    And on the 'projecten' (dutch word for projects) page i've made some collapsible panels.
    The picture is only showing when you click on the text once, when you click again the picture disappears, that's what i want.
    But in Internet Explorer it always shows, and that's not what i want.
    How do I get this right in Internet explorer?
    (if it's possible a second question: How do i get on the 'werkzaamheden' page the 3 links in the top left corner on the position like they are in safari and firefox.)

    It lookslike you fixed it, it works fine in IE7 and 8

  • Spry Collapsible Panel Problem in Safari

    When check my site in Firefox, there are no problems, but
    when I open it in Safari, none of the CSS settings are applied to
    the Collapsible Panel widget. Some settings I have make the widget
    200 px width and make it have a black background, but Safari
    doesn't show these. HERE IS THE CODE OF MY HOMEPAGE:
    <!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>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    <style type="text/css">
    body {
    background: url(Victorias%20Secret%20models.jpg) fixed
    no-repeat center bottom;
    </style>
    <script src="SpryAssets/SpryCollapsiblePanel.js"
    type="text/javascript"></script>
    <link href="SpryAssets/SpryCollapsiblePanel.css"
    rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="CollapsiblePanel1" class="CollapsiblePanel">
    <div class="CollapsiblePanelTab"
    tabindex="0"></div>
    <div class="CollapsiblePanelContent">
    <p>BLOG</p>
    <p>LISTEN</p>
    <p>WATCH</p>
    <p>ABOUT</p>
    </div>
    </div>
    <script type="text/javascript">
    var CollapsiblePanel1 = new
    Spry.Widget.CollapsiblePanel("CollapsiblePanel1",
    {contentIsOpen:false});
    </script>
    </body>
    </html>
    AND HERE IS THE CODE OF MY CSS
    @charset "UTF-8";
    .CollapsiblePanel {
    margin: 0px;
    padding: 0px;
    width: 200px;
    color: #FFFFFF;
    background-color: #000000;
    .CollapsiblePanelTab {
    background-color: #000000;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    -moz-user-select: none;
    -khtml-user-select: none;
    font-family: sans-serif;
    font-size: 0.7em;
    font-weight: bold;
    color: #FFFFFF;
    height: 40px;
    .CollapsiblePanelContent {
    margin: 0px;
    padding: 0px;
    background-color: #000;
    .CollapsiblePanelTab a {
    color: black;
    text-decoration: none;
    background-color: #000;
    height: 40px;
    .CollapsiblePanelOpen .CollapsiblePanelTab {
    background-color: #000;
    color: #FFFFFF;
    .CollapsiblePanelTabHover, .CollapsiblePanelOpen
    .CollapsiblePanelTabHover {
    background-color: #000;
    .CollapsiblePanelFocused .CollapsiblePanelTab {
    background-color: #000;
    THANKS FOR YOUR HELP

    Can't tell by that code, can you post a URL to the page?
    Ken Ford
    Adobe Community Expert - Dreamweaver/ColdFusion
    Fordwebs, LLC
    http://www.fordwebs.com
    "kkaiser1" <[email protected]> wrote in
    message news:[email protected]...
    > When check my site in Firefox, there are no problems,
    but when I open it in
    > Safari, none of the CSS settings are applied to the
    Collapsible Panel widget.
    > Some settings I have make the widget 200 px width and
    make it have a black
    > background, but Safari doesn't show these. HERE IS THE
    CODE OF MY HOMEPAGE:
    > <!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>
    >
    > <title>Untitled Document</title>
    >
    > <meta http-equiv="Content-Type" content="text/html;
    charset=UTF-8" />
    > <style type="text/css">
    >
    > body {
    > background: url(Victorias%20Secret%20models.jpg) fixed
    no-repeat center
    > bottom;
    > }
    >
    > </style>
    > <script src="SpryAssets/SpryCollapsiblePanel.js"
    > type="text/javascript"></script>
    > <link href="SpryAssets/SpryCollapsiblePanel.css"
    rel="stylesheet"
    > type="text/css" />
    > </head>
    > <body>
    > <div id="CollapsiblePanel1"
    class="CollapsiblePanel">
    > <div class="CollapsiblePanelTab"
    tabindex="0"></div>
    > <div class="CollapsiblePanelContent">
    > <p>BLOG</p>
    > <p>LISTEN</p>
    > <p>WATCH</p>
    > <p>ABOUT</p>
    > </div>
    > </div>
    > <script type="text/javascript">
    >
    > var CollapsiblePanel1 = new
    Spry.Widget.CollapsiblePanel("CollapsiblePanel1",
    > {contentIsOpen:false});
    >
    > </script>
    > </body>
    > </html>
    >
    >
    > AND HERE IS THE CODE OF MY CSS
    >
    > @charset "UTF-8";
    >
    > .CollapsiblePanel {
    > margin: 0px;
    > padding: 0px;
    > width: 200px;
    > color: #FFFFFF;
    > background-color: #000000;
    > }
    >
    > .CollapsiblePanelTab {
    > background-color: #000000;
    > margin: 0px;
    > padding: 0px;
    > cursor: pointer;
    > -moz-user-select: none;
    > -khtml-user-select: none;
    > font-family: sans-serif;
    > font-size: 0.7em;
    > font-weight: bold;
    > color: #FFFFFF;
    > height: 40px;
    > }
    >
    > .CollapsiblePanelContent {
    > margin: 0px;
    > padding: 0px;
    > background-color: #000;
    > }
    >
    > .CollapsiblePanelTab a {
    > color: black;
    > text-decoration: none;
    > background-color: #000;
    > height: 40px;
    > }
    >
    > .CollapsiblePanelOpen .CollapsiblePanelTab {
    > background-color: #000;
    > color: #FFFFFF;
    > }
    >
    > .CollapsiblePanelTabHover, .CollapsiblePanelOpen
    .CollapsiblePanelTabHover {
    > background-color: #000;
    > }
    >
    > .CollapsiblePanelFocused .CollapsiblePanelTab {
    > background-color: #000;
    > }
    >
    >
    > THANKS FOR YOUR HELP
    >

  • Spry Collapsible Panel Problem with Safari

    Hi my Spry Collapsible Panel looks great in Firefox, Camino, and IE, but the top border, which I am using as a line to divide items in the list, and which I have specified in the CSS page, doesn't show up in Safari and Google Chrome.  Just nothing, and everything else works.  Any help would be GREATLY appreciated!   My CSS page reads as follows:
    .CollapsiblePanel {
        color: #000000;
        border-top-style: solid;
        border-top-width: 0.5px;
        padding-top: 3px;
        padding-right: 0px;
        padding-bottom: 3px;
        padding-left: 0px;
    #apDiv3 #CollapsibleLINE {
        border-top-width: 20px;
        border-top-style: solid;
        border-top-color: #330099;
    .CollapsiblePanelTab {
        margin: 0px;
        padding: 20px;
        cursor: pointer;
        -moz-user-select: none;
        -khtml-user-select: none;
        font-family: sans-serif;
        font-size: 0.7em;
        font-weight: bold;
        color: #3366FF;
        border-top-width: thick;
        border-right-width: thin;
        border-bottom-width: thin;
        border-left-width: thin;
        border-top-style: solid;
        border-top-color: #FF00CC;
        border-right-color: #000000;
        border-bottom-color: #000000;
        border-left-color: #000000;
    /* This is the selector for a CollapsiblePanel's Content area. It's important to note that
    * you should never put any padding on the content area element if you plan to
    * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
    * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
    * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
    * to make the widget function. You can use any class name you want to style a
    * CollapsiblePanel content container.
    .CollapsiblePanelContent {
        margin: 0px;
        padding: 0px;
    .CollapsiblePanelTab a {
        text-decoration: none;
    /* This is an example of how to change the appearance of the panel tab as the
    * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
    * and removed from panel tab containers as the mouse enters and exits the tab container.
    .CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
        color: #666666;
    .CollapsiblePanelFocused .CollapsiblePanelTab {
    #apDiv1 .overlay {
    and my page looks like this:
    <link href="untitled.css" rel="stylesheet" type="text/css">
    <script src="Scripts/AC_ActiveX.js" type="text/javascript"></script>
    <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
    <style type="text/css">
    <!--
    #apDiv1 {
        position:absolute;
        width:808px;
        height:502px;
        z-index:1;
        left: 0px;
        top: 111px;
    #apDiv2 {
        position:absolute;
        width:2;
        height:747px;
        z-index:2;
        top: 109px;
        left: 34px;
        filter: alpha(opacity=75);
    #apDiv3 {
        position:absolute;
        width:128px;
        height:344px;
        z-index:3;
        left: 57px;
        top: 126px;
        filter: alpha(opacity=75);
    -->
    div:active, div:focus, div:hover {
        outline-style: none;
        -moz-outline-style:none;
    </style>
    <link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" >
    <style type="text/css">
    <!--
    #apDiv4 {
        position:absolute;
        left:403px;
        top:115px;
        width:164px;
        height:312px;
        z-index:4;
    #apDiv3 #CollapsiblePanel2 .CollapsiblePanelContent font {
        color: #000000;
    #apDiv5 {
        position:absolute;
        left:57px;
        top:22px;
        width:722px;
        height:78px;
        z-index:4;
    #apDiv6 {
        position:absolute;
        left:551px;
        top:22px;
        width:397px;
        height:39px;
        z-index:5;
    #apDiv7 {
        position:absolute;
        left:285px;
        top:123px;
        width:478px;
        height:398px;
        z-index:5;
    #apDiv8 {
        position:absolute;
        left:325px;
        top:174px;
        width:276px;
        height:153px;
        z-index:6;
    -->
    </style>
    <div id="apDiv5"><img src="IMAGES/logo3.jpg" width="843" height="83" /></div>
    <div id="frontphoto"></div>
    <div id="apDiv1"><img src="IMAGES/Backgound.jpg" alt="back" width="1032" height="516" /></div>
    <div id="apDiv2"><img src="IMAGES/overlay.png" alt="Overlay" width="174" height="720" /></div>
    <div id="apDiv3">
      <div id="CollapsiblePanel2" class="CollapsiblePanel">
        <div tabindex="0"><font size="2" face="Georgia, Times New Roman, Times, serif">photography</font></div>
        <div class="CollapsiblePanelContent">
          <table width="118" border="0" align="center" cellpadding="3" cellspacing="0">
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">portraits</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">events</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">landscapes</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">experiments</font></em></td>
            </tr>
          </table>
        </div>
      </div>
      <div id="CollapsiblePanel1" class="CollapsiblePanel">
        <div tabindex="0"><font size="2" face="Georgia, Times New Roman, Times, serif">print</font></div>
        <div class="CollapsiblePanelContent">
          <table width="118" border="0" align="center" cellpadding="3" cellspacing="0">
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">posters</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">books &amp; packaging</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">invitations</font></em></td>
            </tr>
          </table>
        </div>
      </div>
      <div id="CollapsiblePanel4" class="CollapsiblePanel">
        <div tabindex="0"><font size="2" face="Georgia, Times New Roman, Times, serif">motion</font></div>
        <div>
          <table width="120" border="0" align="center" cellpadding="3" cellspacing="0">
            <tr>
              <td width="114"><em><font size="2" face="Georgia, Times New Roman, Times, serif">websites</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">animations</font></em></td>
            </tr>
          </table>
        </div>
      </div>
      <div id="CollapsiblePanel5" class="CollapsiblePanel">
        <div tabindex="0"><font size="2" face="Georgia, Times New Roman, Times, serif">about</font></div>
        <div>
          <table width="120" border="0" align="center" cellpadding="3" cellspacing="0">
            <tr>
              <td width="114"><em><font size="2" face="Georgia, Times New Roman, Times, serif">honors</font></em></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">background</font></em></td>
            </tr>
          </table>
        </div>
      </div>
      <div id="CollapsiblePanel6" class="CollapsiblePanel">
        <div tabindex="0"><font size="2" face="Georgia, Times New Roman, Times, serif">contact</font></div>
        <div class="CollapsiblePanelContent">
          <table width="120" border="0" align="center" cellpadding="3" cellspacing="0">
            <!--DWLayoutTable-->
            <tr>
              <td width="114"><a href="mailto:[email protected]" style="text-decoration:none"><font color="#333333" size="2" face="Georgia, Times New Roman, Times, serif">email</font></a></td>
            </tr>
            <tr>
              <td><em><font size="2" face="Georgia, Times New Roman, Times, serif">202.321.4248</font></em></td>
            </tr>
          </table>
        </div>
      </div>
    </div>
    <script type="text/javascript">
    <!--
    var CollapsiblePanel4 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel4", {contentIsOpen:false});
    var CollapsiblePanel5 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel5", {contentIsOpen:false});
    var CollapsiblePanel6 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel6", {contentIsOpen:false});
    var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
    var CollapsiblePanel2 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel2", {contentIsOpen:false});
    //-->
    </script>

    I am sorry, I tried in FF, IE7/8 and Chrome and they all look the same.

Maybe you are looking for

  • Clearing some payments: messages

    Gurus i am struggling to clear some payments. "type" ZP when i run FBl1n with special GL, i am getting 2 entries with status in red. we dont want it in the display, hence i try to clear them. since its done loong back, the user doesnt remember whethe

  • Validation returns : no data found + unhandled user-defined exception

    Hi, I'm working with Application Express 4.1.1.00.23. I have an application for timesheet management. On one page, I've got a report (not interactive) in which you can enter the hours you've worked. First you add a free line, choose the task and then

  • Add emailadress to PO in ABAP.

    Hi, If I update vendor address through PO (ME22N), it will update table ADR6 (and all the other ADR* talbes) and add a new address number to the data in EKKO. so the connection changes from EKKO-LiFNR --> LFA1-LIFNR/ADRNR --> ADR6-ADRESSNUMBER  to EK

  • Release strategy should trigger in different systems EHP7 and ECC6

    Hi All, At our client side some are using  ECC 6 and few are on EHP7.We need to define the release strategy in a such a way that both the user can approve the PR in cross system.For example- user A is  using ECC6 and he created PR ,now he need to tak

  • Picture Game Help

    Hey so i am trying to make a picture game where you have to click the mouse picture to do well, and the taz picture you mess up. I will add my code here, here are the images that are needed: http://www.geocities.com/CollegePark/Lounge/6707/taz.jpg ht