Problems with spry accordian widget in CS5

I am updating a client's website and am having problems with the spry accordian widget. I read that it has been replaced with jQuery in the latest version and am told I can modify my existing spry widgets but cannot add new ones. In trying to modify the existing widget I get error alerts. I guess adding a new accordian tab is not considered a modification of the existing widget. I only have CS5 version of DW. What to do?  Thanks in advance for your help.

Hi Patricia,
you with your CS5 can continue to use the spry accordian widget BUT it's inopportune. I quote from different contributions of the forum: "Spry has been deprecated and is no longer officially supported by Adobe", “Adobe abandoned Spry late last year after CS6 came out. Future products will probably not contain any Spry so learning to use jQuery is a valuable skill to have for the future.” So I/we recommend you to switch to a jQuery library for your further requirements."
You may have a look here: http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu.htm, where you will find a wide range of different menus.
On the other hand - to become closer with your problem - you could send us the link to your website in question.
Hans-Günter

Similar Messages

  • Problem with spry in IE

    hey guys im having a problem with Spry in IE only..
    Ive tried the corrent browsers and it seems to be working well
    Firefox
    Opera
    Safari
    but Internet Explorer is not working the menus just wont drop down past my flash player?
    any help would be great
    heres the link to my temp site so you guys can see what i mean
    www.dreamcatchermeadows.com/new_site/site/index.html
    any help would be great
    Thanks

    i checked the compatability button on dream weaver and this come up
    Dreamweaver Browser Compatibility Check
    14-February-2011 at 01:26:05 PM GMT-08:00.
    Target Browser Errors Warnings
    Internet Explorer 6.0
    1
    0
    Internet Explorer 7.0
    1
    0
    Internet Explorer for Macintosh 5.2
    1
    0
    Firefox 1.5
    1
    0
    Netscape 8.0
    1
    0
    Opera 8.0
    1
    0
    Opera 9.0
    1
    0
    Safari 2.0
    1
    0
    Total
    8
    0
    Details:
    #000000
    #000000
    Error
    Found 1 errors in SpryMenuBarHorizontal.css
    Firefox 1.5; Internet Explorer 6.0, 7.0; Internet Explorer for Macintosh 5.2; Netscape 8.0; Opera 8.0, 9.0; Safari 2.0
    line 19
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    End of report.

  • Problem with Dashboard Details Widget

    Hi!
    I'm using SCOM 2012R2 UR 4 running og SQL 2012R2 with 3 MS. I have problems with the Details widget on my Dashboards. The problem is that when I select an object, no data is showing up in the details widget - see picture.
    I've deleted the "Health Service State" folder on all MS's and restarted them. I've also started the console witn /clearcache without luck.
    In addition I've created an SQL maintenance plan running sp_updatestats every 30. minutes, but it
    still fails...
    What should I do?
    Best regards
    Rune Haugen

    Rune Haugen you are right.
    1) try to restart the opeations console with /clearcache
    2) try to import the following MP again an make sure that their version number is 7.1.10226.1046
     Microsoft.SystemCenter.Visualization.Library.mpb
     Microsoft.SystemCenter.Visualization.Component.Library.mpb
     Microsoft.SystemCenter.Advisor.mpb
     Microsoft.SystemCenter.Advisor.Internal.mpb
     Microsoft.SystemCenter.2007.mp
    Roger

  • Problem with the clock widget

    Hi,
       I would like to know if someone have a problem with the clock widget after doing the update system to Mac OS X Mavericks (v.10.9), cause the appearance of my clock was like this (attached image). Pay attention for the position of hands of the clock (watch hands): Don't have something strange?
      Anyone know how to fix this problem?
    Thanks in advance.

    Hi, I have the same problem, I have done a fresh install of OS X and still did not fix the clock ... For when a new update?
    Thanks

  • Spry Accordian Widget

    OK, I'm thinking this may be impossible to explain, but here
    goes. I have a simple table. I install a Spry Accordian widget to
    one of the table's columns, and the whole table (the who page
    actually) explodes laterally, breaking apart pictures, and
    segmenting what was just a simple table. What gives here? Any help
    is MOST appreciated!!

    add the option defaultPanel:-1 to the constructor
    var bla = new
    Spry.Widget.Accordion('id',{defaultPanel:-1});

  • Is anyone having problems with the stock widget not updating?

    Is anyone having problems with the stock widget not updating?

    Widgets unfortunately have gone by the wayside since Apple introduced the App Store a couple years ago.  No widget has received any official recognition in the Apple listing of Widgets since that time.  So it is entirely possible the widget has gotten redirected.   There are many other Apps for stocks.  I personally like the Nasdaq Quote website since it knows mutual funds and other markets as well.

  • Problem with Spry Menu Bar 2.0 (1.0) re - CSS

    Hello:
    I am having some difficulty with a Spry Menu Bar (horizontal) 2.0 (1.0)  that I have created.  Initially I thought the problem was with regard to rendering issues on IE 6.0, however the problem seems to be more general than that and I have come to believe that it has to do with the CSS created by the Widget Browser and modified once imported into the webpage.  Hence I have elected to post my issue here rather than on the spry page.
    I have relied on the tutorial provided by David Powers (Bayside.css) and in addition other documentation regarding the Spry menu bar UI.  The problem appeared to be one of IE 6 rendering the page with a gap that is created when the drop down menus appear, thus pushing down any divs that appear below the page.
    However, through a painstaking process of trial and error my problem now seems to be that when I export the CSS generated by the widget browser to an external style sheet (the general style sheet governing the whole site), it conflicts with other CSS styles regarding links etc.  The end result is that all the padding, background colours, background images, and text colours are lost.  So long as the CSS remains within the head this doesn't happen.
    My thinking is that this must have to do with issues of specificity, inheritence, etc.
    The site can be viewed at the following URL: http://www.aclco.org/testing/index.html.  In its current form all CSS related to the menu bar is found in the head of each page.  (see CSS below).
    My question is can I establish a separate style sheet for the horizontal menu bar and have those styles applied specifically (and only) to the menu bar.  My only other alternative is to work through the remainder of the general style sheet and work through any issues of specificity/inheritance -- which may be the "best" practice, but it risks causing other "cascading" [sic] problems elsewhere.
    Any advice or suggestions or directed reading (that would point to a solution) that could be offered would be greatly appreciated.
    Steve Webster
    The CSS governing the horizontal menu bar is as follows:  (currently the following CSS is embedded in the head of the web page)
    <style type="text/css">
    /*  -- Begins Spry Menu Widget 2.0 (1.0) Horizontal menu bar Custom styles --  */
    /* BeginOAWidget_Instance_2141544: #MenuBar */
    /* Settable values for skinning a Basic menu via presets. If presets are not sufficient, most skinning should be done in
        these rules, with the exception of the images used for down or right pointing arrows, which are in the file SpryMenuBasic.css
         These assume the following widget classes for menu layout (set in a preset)
        .MenuBar - Applies to all menubars - default is horizontal bar, all submenus are vertical - 2nd level subs and beyond are pull-right.
        .MenuBarVertical - vertical main bar; all submenus are pull-right.
        You can also pass in extra classnames to set your desired top level menu bar layout. Normally, these are set by using a preset.
        They only apply to horizontal menu bars:
            MenuBarLeftShrink - The menu bar will be horizontally 'shrinkwrapped' to be just large enough to hold its items, and left aligned
            MenuBarRightShrink - Just like MenuBarLeftShrink, but right aligned
            MenuBarFixedLeft - Fixed at a specified width set in the rule '.MenuBarFixedLeft', and left aligned. 
            MenuBarFixedCentered -  - Fixed at a specified width set in the rule '.MenuBarFixedCentered',
                            and centered in its parent container.
            MenuBarFullwidth - Grows to fill its parent container width.
        In general, all rules specified in this file are prefixed by #MenuBar so they only apply to instances of the widget inserted along
        with the rules. This permits use of multiple MenuBarBasic widgets on the same page with different layouts. Because of IE6 limitations,
        there are a few rules where this was not possible. Those rules are so noted in comments.
    #MenuBar  {
        background-color:transparent;
        font-family: Arial, Helvetica, sans-serif; /* Specify fonts on on MenuBar and subMenu MenuItemContainer, so MenuItemContainer,
                                                    MenuItem, and MenuItemLabel
                                                    at a given level all use same definition for ems.
                                                    Note that this means the size is also inherited to child submenus,
                                                    so use caution in using relative sizes other than
                                                    100% on submenu fonts. */
        font-weight: normal;
        font-size: 17px;
        font-style: normal;
        padding:0;
    /* Caution: because ID+class selectors do not work properly in IE6, but we want to restrict these rules to just this
    widget instance, we have used string-concatenated classnames for our selectors for the layout type of the menubar
    in this section. These have very low specificity, so be careful not to accidentally override them. */
    .MenuBar br { /* using just a class so it has same specificity as the ".MenuBarFixedCentered br" rule bleow */
        display:none;
    .MenuBarLeftShrink {
        float: left; /* shrink to content, as well as float the MenuBar */
        width: auto;
    .MenuBarRightShrink {
        float: right; /* shrink to content, as well as float the MenuBar */
        width: auto;
    .MenuBarFixedLeft {
        float: left;
        width: 80em;
    .MenuBarFixedCentered {
        float: none;
        width: 80em;
        margin-left:auto;
        margin-right:auto;
    .MenuBarFixedCentered br {
        clear:both;
        display:block;
    .MenuBarFixedCentered .SubMenu br {
        display:none;
    .MenuBarFullwidth {
        float: left;
        width: 100%;
    /* Top level menubar items - these actually apply to all items, and get overridden for 1st or successive level submenus */
    #MenuBar  .MenuItemContainer {
        padding: 0px 0px 0px 0px;
        margin: 0;     /* Zero out margin  on the item containers. The MenuItem is the active hover area.
                    For most items, we have to do top or bottom padding or borders only on the MenuItem
                    or a child so we keep the entire submenu tiled with items.
                    Setting this to 0 avoids "dead spots" for hovering. */
    #MenuBar  .MenuItem {
        padding: 10px 10px 10px 4px;
        background-color:#000088;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Navigation%20Bar%20Segm ent-Dark.png);
        background-repeat:repeat-x;       
    #MenuBar  .MenuItemFirst {
        border-style: none none none none;
    #MenuBar .MenuItemLast {
        border-style: none none none none;
    #MenuBar  .MenuItem  .MenuItemLabel{
        text-align:center;
        line-height:1.4em;
        color:#ffffff;
        background-color:transparent;
        padding: 0px 18px 0px 5px;
        width: 10em;
        width:auto;
    .SpryIsIE6 #MenuBar  .MenuItem  .MenuItemLabel{
        width:1em; /* Equivalent to min-width in modern browsers */
    /* First level submenu items */
    #MenuBar .SubMenu  .MenuItem {
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        font-size: 15px;
        font-style: normal;
        background-color:#000088;
        padding:0px 2px 0px 0px;
        border-width:0px;
        border-color: #cccccc #cccccc #cccccc #cccccc;
        /* Border styles are overriden by first and last items */
        border-style: solid solid none solid;
    #MenuBar  .SubMenu .MenuItemFirst {
        border-style: none;
        padding: 0px;
    #MenuBar  .SubMenu .MenuItemFirst .MenuItemLabel{
        padding-top: 0px;
    #MenuBar .SubMenu .MenuItemLast {
        border-style: none none none none;
    #MenuBar .SubMenu .MenuItemLast .MenuItemLabel{
        padding-bottom: 10px;
    #MenuBar .SubMenu .MenuItem .MenuItemLabel{
        text-align:left;
        line-height:1em;   
        background-color:transparent;
        color:#ffffff;
        padding: 10px 10px 10px 10px;
        width: 240px;
    /* Hover states for containers, items and labels */
    #MenuBar .MenuItemHover {
        background-color: #2E35A3;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Navigation%20Bar%20Segm ent%20Light2.png);
        background-repeat:repeat-x;
    #MenuBar .MenuItemWithSubMenu.MenuItemHover .MenuItemLabel{
        background-color: transparent; /* consider exposing this prop separately*/
        color: #ffffff;
    #MenuBar .MenuItemHover .MenuItemLabel{
        background-color: transparent;
        color: #ffffff;
    #MenuBar .SubMenu .MenuItemHover {
        background-color:#2E35A3;
    #MenuBar .SubMenu .MenuItemHover .MenuItemLabel{
        background-color: transparent;
        color: #ffffff;
    /* Submenu properties -- First level of submenus */
    #MenuBar .SubMenuVisible {
        background-color: transparent;
        min-width:0%;  /* This keeps the menu from being skinnier than the parent MenuItemContainer - nice to have but not available on ie6 */
        border-style: none none none none;
    #MenuBar.MenuBar .SubMenuVisible {/* For Horizontal menubar only */
        top: 100%;    /* 100% is at the bottom of parent menuItemContainer */
        left:0px; /* 'left' may need tuning depending upon borders or padding applied to menubar MenuItemContainer or MenuItem,
                        and your personal taste.
                        0px will left align the dropdown with the content area of the MenuItemContainer. Assuming you keep the margins 0
                        on MenuItemContainer and MenuItem on the parent
                        menubar, making this equal the sum of the MenuItemContainer & MenuItem padding-left will align
                        the dropdown with the left of the menu item label.*/
        z-index:10;
    #MenuBar.MenuBarVertical .SubMenuVisible {
        top: 0px;   
        left:100%;
        min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse */
    /* Submenu properties -- Second level submenu and beyond - these are visible descendents of .MenuLevel1 */
    #MenuBar .MenuLevel1 .SubMenuVisible {
        background-color: transparent;
        min-width:0px; /* Do not neeed to match width to parent MenuItemContainer - items will prevent total collapse*/
        top: 0px;    /* If desired, you can move this down a smidge to separate top item''s submenu from menubar -
                    that is really only needed for submenu on first item of MenuLevel1, or you can make it negative to make submenu more
                    vertically 'centered' on its invoking item */
        left:100%; /* If you want to shift the submenu left to partially cover its invoking item, you can add a margin-left with a
                    negative value to this rule. Alternatively, if you use fixed-width items, you can change this left value
                    to use px or ems to get the offset you want. */
    /* IE6 rules - you can delete these if you do not want to support IE6 */
    /* A note about multiple classes in IE6.
    * Some of the rules above use multiple class names on an element for selection, such as "hover" (MenuItemHover) and "has a subMenu" (MenuItemWithSubMenu),
    * giving the selector '.MenuItemWithSubMenu.MenuItemHover'.
    * Unfortunately IE6 does not support using mutiple classnames in a selector for an element. For a selector such as '.foo.bar.baz', IE6 ignores
    * all but the final classname (here, '.baz'), and sets the specificity accordingly, counting just one of those classs as significant. To get around this
    * problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate compound classnames for IE6, such as 'MenuItemWithSubMenuHover'.
    * Since there are a lot of these needed, the plugin does not generate the extra classes for modern browsers, and we use the CSS2 style mutltiple class
    * syntax for that. Since IE6 both applies rules where
    * it should not, and gets the specificity wrong too, we have to order rules carefully, so the rule misapplied in IE6 can be overridden.
    * So, we put the multiple class rule first. IE6 will mistakenly apply this rule.  We follow this with the single-class rule that it would
    * mistakenly override, making sure the  misinterpreted IE6 specificity is the same as the single-class selector, so the latter wins.
    * We then create a copy of the multiple class rule, adding a '.SpryIsIE6' class as context, and making sure the specificity for
    * the selector is high enough to beat the single-class rule in the "both classes match" case. We place the IE6 rule at the end of the
    * css style block to make it easy to delete if you want to drop IE6 support.
    * If you decide you do not need IE6 support, you can get rid of these, as well as the inclusion of the SpryMenuBarIEWorkaroundsPlugin.js script.
    * The 'SpryIsIE6' class is placed on the HTML element by  the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser is Internet Explorer 6. This avoids the necessity of IE conditional comments for these rules.
    .SpryIsIE6 #MenuBar .MenuBarView .MenuItemWithSubMenuHover .MenuItemLabel /* IE6 selector  */{
        background-color: transparent; /* consider exposing this prop separately*/
        color: #ffffff;
    .SpryIsIE6 #MenuBar .MenuBarView .SubMenu .MenuItemWithSubMenuHover .MenuItemLabel/* IE6 selector  */{
        background-color: transparent; /* consider exposing this prop separately*/
        color: #ffffff;
    .SpryIsIE6 #MenuBar .SubMenu .SubMenu  /* IE6 selector  */{
        margin-left: -0px; /* Compensates for at least part of an IE6 "double padding" version of the "double margin" bug */
    /* EndOAWidget_Instance_2141544 */
    /* Ends Spry Menu Bar Widget 2.0 (1.0) Horizontal Menu Custom styles */
    </style>
    The CSS governing the site generally is reproduced below:  (my belief is that it is the a:link, a:visited,  a:hover, a:active styles that may be in conflict).
    @charset "utf-8";
    body  {
        font: 100% Verdana, Arial, Helvetica, sans-serif;
        min-height: 0; /* This is necessary to overcome the "haslayout" bug that is found in Windows 7 in conjuction with IE8.  For More information see: URL -- http://reference.sitepoint.com/css/haslayout.html */
        margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
        padding: 0;
        text-align:center; /* This allows for the centering of the container and overcomes a bug inherent in IE 5 */
        color: #000000;
        list-style-image: none;
        background-color: #FCFCFC;
    h1,h2,h3,h4,h5,h6 {
    color:#000066;
    a:link {
        color: #151A96;
        text-decoration: underline;
    a:visited {
        text-decoration: underline;
        color: #1B8DCD;
    a:hover {
        text-decoration: none;
        color: #F30A0A;
    a:active {
        text-decoration: underline;
        color: #151A96;
    #container {
        width: 960px;   
        margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
        text-align: left; /* this overrides the text-align: center on the body element. */
        background-image:
        url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Midsection%20_960.png);
        background-repeat: repeat-y;
    #header {
            padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
            width:960px;
            height:332px;
            background-image:
            url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Header_960.png);
            background-repeat:no-repeat;
    #header h1 {
        margin-right: 0px; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
        padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
        display:none;
    #header img {
        display: none;
    #Main_nav_contents {
        padding: 0;
        margin-top: 0px;
        height: 39px;
        width: 950px;       
        padding-top: 275px; 
        padding-left: 39px;
        z-index: 3; 
    #MenuBarVertical {
        margin-bottom: 50px;
        padding-top: 50px;
        padding-bottom:200px;
        padding-left: 15px;
        padding-right: 15px;
    .mainContent_left {
        margin: 0;/* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
        padding-left:30px;
        padding-right:20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
        width: 600px;
        float: left;
    .sidebar_right {
        float: right; /* since this element is floated, a width must be given */
        width: 270px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
        margin-top: 30px;
        margin-left:0;
        margin-right:10px;
        font-size:90%;
    .mainContent_right {
        margin-left: 10px;
        padding-left:30px;
        padding-right:20px;
        width: 600px;
        float: right;
    .sidebar_left {
        float: left; /* since this element is floated, a width must be given */
        width: 270px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
        margin-top: 30px;
        margin-left:30px;
        margin-right:0;
        overflow: hidden;
        font-size:90%;
    .main_content_centered {
        width: 650px;
        margin-left: 155px;
    .main_content_centered_header {
        margin-left: 75px;
    .sidebar_textbox {
        margin: 0px;   
        width: 260px;
        padding: 2px;
    .sidebar_textbox_header {
        width:255px;
        height:58px;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20He ader.png);
    .sidebar_textbox_background_middle {
         width: 255px;   
        padding-top: 12px;   
        padding-bottom: 10px;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20Mi ddle.png);
        background-repeat: repeat-y;
    .sidebar_textbox_content {
        /* The width and padding are set as follows to accomodate quirks in browser rendering and to ensure that text is contained within the background of the text box */
        width: 230px;
        padding-left: 20px;
        padding-right: 40px;
    .sidebar_textbox_footer {
        width:255px;
        height:64px;
    background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Portrait%20Textbox%20Foo ter.png);
    #issues_menu a:link {
        color: #151A96;
        text-decoration: none;
        font-weight:bold;
    #issues_menu a:visited {
        color: #151A96;
        font-weight:bold;
        text-decoration: none;
    #issues_menu a:hover {   
        color: #F30A0A;
        font-weight:bold;
        font-style: oblique;
        text-decoration: none;
    #issues_menu a:active {
        color: #151A96;
        font-weight:bold;
        text-decoration: none;
    #archives {
        padding-top: 15px;
        padding-right: 15px;
        padding-bottom: 20px;
        padding-left: 0px;
    .landscape_textbox {
        width: 500px;
        margin-right: 0px;
        margin-left: 30px;
        padding-top:35px;
        padding-bottom: 25px;
        font-style: normal;
        font-weight: normal;
    .landscape_textbox_hdr {
        width:500px;
        height:38px;
        margin:auto;
        padding:0;
        background-image:
    url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20Header.png);
    .landscape_textbox_middle {
        width:auto;
        margin:auto;
        padding-top: 12px;
        padding-bottom: 12px;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/landscapte%20Textbox%20 Middle.png);
        background-repeat:repeat-y;
    .landscape_textbox_content {
        width:450px;
        padding:25px;
    .landscape_textbox_ftr {
        width:500px;
        height:44px;
        margin:auto;
        padding:0;
        background-image:url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20F ooter.png);
    #footer {
        padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
        width: 960px;
        height: 222px;
        background-image:
        url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Footer%20_960.png);
        background-repeat:no-repeat;
    #footer p {
        margin: 0px; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
        padding:0px; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
        text-align:center;
        margin-left: 50px;
        margin-right: 50px;
        padding: 10px;
        font-size: small;
    #footer h5 {
    text-align:center;
    .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: right;
        margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page */
        float: left;
        margin-right: 8px;
    .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .dropcap {
        display: block;
        float: left;
        line-height: 80%;
        font-size: 250%;
        font-weight: bolder;
        color: #000066;   
        padding: .03em .1em 0 0;
    .red_arrows {
        list-style-position: outside;
        list-style-image: url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Arrow%20Large.png);   
    .blue_bullets {
        list-style-position: outside;
        list-style-image: url(../ACLCO%20Graphics%20-%20Web%20site%20Parts/Bullet%20Medium%20Full.png);   
    .attention {
        color: #F30A0A;
        font-size:x-large;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-style: italic;
        font-weight:900;
    .attention_small {
        color: #F30A0A;
        font-size:large;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-style: italic;
        font-weight:900;
    .table {
        table-layout:fixed;
    .blue {
        color: #00F;
    #container .mainContent_left p .blue {
        color: #0303A0;

    Hello Martin:
    Thanks for your input.  However I am not certain we have resolved this issue adequately, or understand the principles governing the css as regards this spry menu framework 2.0 (1.0).
    For example, the menu only works in IE 6.0 if the css remains in the head.  I agree with your original post that it shouldn't make any difference whether the css is posted in the head or in a separate style sheet (so long as specificity issues are addressed).  Both should work -- and yet it doesn't.
    If the CSS is placed in the separate style sheet governing the total site, it doesn't work for 6.0.  If placed at the top of the style sheet, conflicts of specificity prevent the menu from rendering properly in any of the browsers causing the rules for general links to govern the menu.   This has been verified using a cross browser testing.  If the styles are placed at the bottom of the style sheet to help them take precedence, they work in all the browsers except for IE 6.
    The website I am building needs to support IE 6 for a variety of reasons, and because it is catering to the non-profit community and to low income persons, I am mindful of even small differences in page weight.
    So for me, at least, the issue remains baffling.
    I appreciate your input, but also would appreciate the input from others, and especially Adobe Community Professionals and employees.  The spry framework in this regard is not well documented.  I am not certain if this is exclusively a CSS problem, if it might also be complicated by the architecture of the spry framework, or if indeed other variables are at play.
    I would be my hope that in resolving the problem, other users of the this particular spry framework might also benefit.
    Thanks,
    Steve.

  • Help with Spry Rating Widget within a Spry Repeating Region

    My link  http://www.youthinkyougotitbad.com
    This is a long question, but it seems to me if answered somewhere it could help alot of people in the spry community creating comment boards as it uses three important spry widgets: rating, repeating, and tabbed panels. I am trying to use spry rating widget within a spry repeating region within a spry tabbed panel with xml. I was trying to go with the pulse light script (http://forums.adobe.com/message/3831721#3831721) but Gramps told me about the spry rating widget. But I have ran into a couple more problems. First, I couldnt find that much information on the forums or online about how to do the php page with the spry rating widget. None of these have any information on how to do it:
    http://labs.adobe.com/technologies/spry/articles/rating_overview/index .html
    http://labs.adobe.com/technologies/spry/articles/data_api/apis/rating. html
    http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.ht ml
    And it seems that the official examples are so poor (or I am just ignorant, which def could be a possiblity) it shows
    to set the initial rating value from the server, but uses a static value of 4
    http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.html
    <span id="initialValue_dynamic" class="ratingContainer">
             <span class="ratingButton"></span>
             <span class="ratingButton"></span>
             <span class="ratingButton"></span>
             <span class="ratingButton"></span>
             <span class="ratingButton"></span>      
             <input id="spryrating1_val" type="text" name="spryrating1" value="4" readonly="readonly" />
             <span class="ratingRatedMsg sample">Thanks for your rating!</span>
    </span>
    <script>
    var initialValue_dynamic = new Spry.Widget.Rating("initialValue_dynamic", {ratingValueElement:'spryrating1_val'});
    </script>
    I finally found a site that has the php and mysql setup.
    http://www.pixelplant.ro/en/articles/article-detail/article/adobe-widgets-for-download.htm l
    But its not perfect. It has the same problem that I ran into with Pulse light, that you had to use php echo within the spry repeating region to set the initial value from the server:
    <span id="spryrating1" class="ratingContainer">
             <span class="ratingButton"></span>
                <input type="text" id="ratingValue" name="dynamic_rate" value="<?php echo $row['average']?>"/>
            </span>
            <script type="text/javascript"
                var rating1 = new Spry.Widget.Rating("spryrating1", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id=spryrating1&val=@@ratingValue@@'});
            </script>
    So instead, I tried with three of my panels (www.youthinkyougotitbad.com) to get the average rating from xml by using the following queries:
    Recent
    Returns the blurts in most recent order along with average rating
    SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC
    Wet Eyed
    Returns the blurts in highest ratings order along with the average rating
    SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r Desc
    Dry Eyed
    Returns the blurts in lowest rating order along with the average rating
    SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r
    These all return the correct xml in the correct order.And they return the average rating of each blurt which I can send to my page with xml.
    My first question is that I dont know how to configure the query on my fourth panel Empathized & Advised the same way because it already has a Group By for the Comment Id.
    SELECT `Comment`.id_Blurt, COUNT(*) as frequency, Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt, `Comment` WHERE Blurt.Id_blurt = `Comment`.id_Blurt GROUP BY `Comment`.id_Blurt ORDER BY COUNT(*) DESC";
    Not sure if you guys need more information to understand that all, if so just ask.
    So after I get my average value through xml to the first three panels, I set my spry repeating region up like this:
    (Blurt panel)
    <div spry:region="pv1" spry:repeatchildren="pv1">           
               <div class="blurtbox">
                <!--  most recent blurt tab-->
                <h3> "{pv1::Blurt}"</h3>
                <p> Blurted from {pv1::Location} at {pv1::Date}</p>
                <p>Empathize or Advise about {pv1::Name}'s Blurt #<a href="detailblurt.php?blurtid={pv1::Id_blurt}"> {pv1::Id_blurt}</a></a></p>
               <span id="{pv1::Id_blurt}" class="ratingContainer">
                <span class="ratingButton"></span>
                <span class="ratingButton"></span>
                <span class="ratingButton"></span>
                <span class="ratingButton"></span>
                <span class="ratingButton"></span>
                <span class="ratingRatedMsg">Thank You! Your tears have been tallied.</span>
                <input type="text" id="ratingValue" name="dynamic_rate" value="{pv1::average_r}"/>
            </span>
            <script type="text/javascript">
                // overview of available options and their values:
                // http://labs.adobe.com/technologies/spry/articles/rating_overview/index.html
                var rating1 = new Spry.Widget.Rating("{pv1::Id_blurt}", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id={pv1::Id_blurt}&val=@@ratingValue@@'});
            </script>
                 <br/>
               </div>
              </div>
    Ok, it registers the right vote in the database with the right blurt id each time. But I am having two problems so far:
    One, even though {pv1::average_r} returns the correct average through xml, it doesn't show the initial rating value for each of the repeating blurts. It seems to show the first one correct, and then just repeat that same value to the other ones that follow. I just dont understand since it can get the correct server value right after you vote (afterRating:'serverValue), that I can't manipulate spryrating.js in some way that I could just replace 'ratingValue' in ratingValueElement:'ratingValue' with something to give me the initial server value.
    Two: Is even more mysterious to me, if you play around with voting on the site, sometimes you are unable to vote on different blurts. Its weird. It seems like that the javascript is completely off just on those blurts. And sometimes its a whole row, sometimes none. But so far its never a problem on the first tabbed panel (Recent), only on the other three. As far as I know, the coding is exactly the same in each tab's repeating region except for the different xml input.
    And, now on the live server, sometimes the pics of tears used to voting dont show up until you click.
    Any help on those three questions (how to query the fourth panel, how to show the initial server value, and the glitches with voting) would be greatly appreciated!! I looked pretty hard on adobe forums and other sites, and didnt see much on how to really use the spry rating widget with php and xml.
    Thanks!!

    Update:
    Ok, the first query on the Recent tab doesnt work for me because it wont show unless its already voted, and since these are supposed to be new blurts, that kind of breaks the whole site:
    "SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC";
    So I replaced it with what I originally had.
    "SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt ORDER BY Blurt.`Date` DESC";
    But this doesn't provide me with the initial average rating:(

  • Having problem with spry menu bar in Internet Explorer.

    I'm having a problem with my spry menu bars in Internet Explorer.
    Here are the pictures:
    Firefox
    Internet Explorer
    HERE ARE THE CODES:
    HTML CODE:
    <style type="text/css">
    <!--
    #apDiv1 {
        position:absolute;
        width:160px;
        height:126px;
        z-index:1;
        left: 205px;
        top: 424px;
        margin: 0 auto;
    -->
    </style>
    <style type="text/css">
    #apDiv3 {
        position:absolute;
        width:254px;
        height:206px;
        z-index:2;
        left: 123px;
        top: 1529px;
    #apDiv4 {
        position:absolute;
        width:250px;
        height:194px;
        z-index:3;
        left: 381px;
        top: 1528px;
    #apDiv5 {
        position:absolute;
        width:256px;
        height:200px;
        z-index:4;
        left: 636px;
        top: 1529px;
    #apDiv6 {
        position:absolute;
        width:349px;
        height:205px;
        z-index:5;
        left: 889px;
        top: 1530px;
    </style>
    <style type="text/css">
    #apDiv7 {
        position:absolute;
        width:887px;
        height:204px;
        z-index:6;
        left: 324px;
        top: 905px;
    #apDiv8 {
        position:absolute;
        width:1295px;
        height:74px;
        z-index:1;
        left: 212px;
        top: 668px;
    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    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];}}
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    <style type="text/css">
    #apDiv2 {
        position:absolute;
        width:209px;
        height:197px;
        z-index:2;
        top: 1220px;
        left: 171px;
    #apDiv9 {
        position:absolute;
        width:331px;
        height:97px;
        z-index:3;
        left: 385px;
        top: 1218px;
    #apDiv10 {
        position:absolute;
        width:292px;
        height:199px;
        z-index:4;
        left: 724px;
        top: 1218px;
    #apDiv11 {
        position:absolute;
        width:200px;
        height:115px;
        z-index:1;
    body {
        background-color: #000;
        background-image: url();
        text-align: center;
        color: #F00;
    .none {
        font-size: 80px;
        font-family: "Times New Roman", Times, serif;
        font-weight: bold;
    #apDiv12 {
        position:absolute;
        width:991px;
        height:60px;
        z-index:5;
        left: 198px;
        top: 192px;
    #apDiv13 {
        position:absolute;
        width:200px;
        height:115px;
        z-index:1;
        left: 588px;
        top: 322px;
    </style>
    <body onLoad="MM_preloadImages('images/WebConfroll.png','images/youthfootballroll.png','images/ statefbsweatshirt.png')">
    <p align="center" class="none"><img src="images/footballtitle.png" width="941" height="183"></p>
    <div align="center">
      <ul id="MenuBar2" class="MenuBarHorizontal">
        <li><a class="MenuBarItemSubmenu" href="#">[Placeholder]</a>
          <ul>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
          </ul>
        </li>
        <li><a href="#" class="MenuBarItemSubmenu">[Placeholder]</a>
          <ul>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
            <li><a href="#">[Placeholder]</a></li>
          </ul>
        </li>
        <li><a class="MenuBarItemSubmenu" href="#">Videos</a>
          <ul>
            <li><a class="MenuBarItemSubmenu" href="#">2008 Videos</a>
              <ul>
                <li><a href="videos/2009 videos/Glenbard part one/partone.html">Glenbard South Game</a></li>
                <li><a href="#">&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&# 160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;[Placeholder]</a></li>
              </ul>
            </li>
            <li><a href="#" class="MenuBarItemSubmenu">2009 Videos</a>
              <ul>
                <li><a href="#">[Placeholder]</a></li>
                <li><a href="#">[Placeholder]</a></li>
              </ul>
            </li>
            <li><a href="#" class="MenuBarItemSubmenu">2010 Videos</a>
              <ul>
                <li><a href="#">[Placeholder]</a></li>
                <li><a href="#">[Placeholder]</a></li>
              </ul>
            </li>
          </ul>
        </li>
      </ul>
    </div>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><span class="cent"><img src="images/bulldoghelmit.png" width="150" height="99" /></span></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p class="cent"> </p>
    <div align="center">
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2008</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Defense%20Stats.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Offense%20Stats.pdf">Offense and Records</a></li>
            <li><a href="http://page.bps101.net/web/t1350/BHS%20All%20Time%20Stats.pdf">AllTime Data</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/Western%20Sun%202009.pdf">Western Sun Final Standings</a></li>
          </ul>
        </li>
        <li> <a href="#" class="MenuBarItemSubmenu">Football Season 2009</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Record Book and Offense</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/All-Time%20Data%202009.pdf">Alltime Data</a></li>
          </ul>
        </li>
        <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2010</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2011%20Checklist.pdf">2010-2011 Offseason Checklist</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Defense%20Stats%20Final.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Stats%20Packet.pdf">Record Book and Offense</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20ALL%20TIME.pdf">Alltime Data</a></li>
          </ul>
        </li>
      </ul>
    </div>
    <p align="center"> </p>
    <p align="center"> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><img src="images/Batavia Youth football.png" alt="" width="869" height="200" /></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','images/WebConfroll.png',1)"></a></p>
    <div align="center">
      <div align="center"></div>
      <div align="center"><a href="http://www.athletics2000.com/upstate8/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','images/WebConfroll.png',1)"><img src="images/WebConf.png" name="Image7" width="206" height="194" border="0" id="Image7" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/statefbsweatshirt.png',1)"><img src="images/statefbsweatshirt.jpg" name="Image6" width="375" height="199" border="0" id="Image6" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/youthfootballroll.png',1)"><img src="images/youth football.png" name="Image8" width="329" height="197" border="0" id="Image8" /></a></div>
    </div>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/youthfootballroll.png',1)"></a></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><img src="images/Logos.png" width="1167" height="199" /></p>
    <script type="text/javascript">
    var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    CSS CODE
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        margin: auto 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: 54em;
        border-top: thick solid #00F;
        border-left: thick solid #00F;
        border-right: thick solid #00F;
        border-bottom: thick solid #00F;
        height: 2.2em;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
        z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        cursor: pointer;
        width: 18em;
        float: left;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        z-index: 1020;
        cursor: default;
        width: 18em;
        position: absolute;
        left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
        left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
        width: 18em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
        position: absolute;
        margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        background-color: #000;
        padding: 0.5em 0.75em;
        color: #C96;
        text-decoration: none;
        text-align: center;
        height: 1.2em;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        background-color: #900;
        color: #009;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
        background-color: #900;
        color: #FFF;
        text-decoration: underline;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarDown.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
        color: #FF0;
        font-family: "Lucida Console", Monaco, monospace;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarRight.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarDownHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarRightHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
        filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
            display: inline;
            f\loat: left;
            background: #FFF;
    The website is http://wwww.bataviabulldogfootball.tk

    Note that running your page through the W3C Validator gives this list of errors: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.bataviabulldogfootball.tk%2F&charset=%2 8detect+automatically%29&doctype=Inline&group=0
    I see that you have a very thin doctype at the top. I suggest you create a new page in Dreamweaver and copy the bit at the top of 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" />
    Then put that code in place of these lines from your current page:
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    I see that you have two opening <body> tags. Delete one; it is not needed. Add the preload images from the second into the first body tag and delete the second.
    I see code below the closing </html> tag. Re position it before the closing </body> tag.
    Because of these errors mentioned above, it was impossible to see the page. Fix and reply here when you have done so.
    Also, it is not possible for me to divine what difficulty you are having. If you can please also express it in English (LOL), I'll be happy to suggest a correction for you!
    Beth
    p.s. Posting entire blocks of code is NEVER as helpful as giving us a link to the pages in action. I seldom read through code dumps here in the Forum.
    Message was edited by: Zabeth69

  • Having Problem with Spry Menu - Help appreciated

    Hello there
    I am currently developing my website but I am having terrible problems with the spry menu. I have tried lots of things but not yet resolved the issue. I will try to give as much info as possible. My website is www.huntfilms.ie
    When I am in dreamweaver the site looks fine and when I preview in browser also looks fine but when I have uploaded to server there is the problem as you can see.
    I uploaded all the files that are required I think . I have attached a screen grab of my server view below. : I have six spry files : js,css and four giff files : I have included the code below. I would apprecaite help as been at this for best part of day with no luck ; going mad here
    thanks
    Barry
    <script src="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="oneColElsCtrHdr">
    <div id="container">
      <div id="header">
        <h1>Hunt Films</h1>
      <!-- end #header --></div>
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/home.html">home</a>    </li>
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/sample.html">Sample work</a></li>
        <li><a href="file:///Macintosh HD/Users/barryhunt/Desktop/huntfilms1/Contact.html">Contact Us</a>    </li>
    </ul>
    <div id="mainContent">
        <p><iframe src="http://player.vimeo.com/video/17962693?title=0&byline=0&portrait=0" width="400" height="320" frameborder="0" webkitAllowFullScreen allowFullScreen></iframe> </p>
        <p> </p>
        <p>Welcome! </p>
        <p>Hunt Films was set up in January 2011 by documentary maker Barry Hunt.</p>
        <p>Barry received training in TV and Video Production with FÁS in Tralee, Co Kerry. During this training Barry produced a series of short films about local artists. In 2006 he worked as assistant editor on the successful RTÉ drama series, ‘Love is the Dfile:///Users/barryhunt/Desktop/Picture%201.pngrug’.</p>
        <p>Since 2010 Barry has embarked on solo projects producing two entertaining half hour documentaries. 'Liberation', explores the world of pigeon racing in Dublin. This film was very well received at the Galway Film Festival 2011. More recently Barry produced 'The Gregory Seat', a documentary which follows Maureen O'Sullivan’s campaign to be elected in the 2011 General Election.</p>
        <p>Barry looks forward to producing more documentaries. He is interested in human stories and hopes that this will form the basis of his future work. At present, Barry is developing projects for film festivals and general broadcast    </p>
        <p> </p>
      <!-- end #mainContent --></div>
      <div id="footer">
        <p>Footer</p>
      <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>
    server view  of files uploaded file:///Users/barryhunt/Desktop/Picture%201.png

    here is the code still not working can anyone tell me why
    <!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>
    <style type="text/css">
    <!--
    body {
              font: 100% Verdana, Arial, Helvetica, sans-serif;
              background: #666666;
              margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
              padding: 0;
              text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
              color: #000000;
    /* Tips for Elastic layouts
    1. Since the elastic layouts overall sizing is based on the user's default fonts size, they are more unpredictable. Used correctly, they are also more accessible for those that need larger fonts size since the line length remains proportionate.
    2. Sizing of divs in this layout are based on the 100% font size in the body element. If you decrease the text size overall by using a font-size: 80% on the body element or the #container, remember that the entire layout will downsize proportionately. You may want to increase the widths of the various divs to compensate for this.
    3. If font sizing is changed in differing amounts on each div instead of on the overall design (ie: #sidebar1 is given a 70% font size and #mainContent is given an 85% font size), this will proportionately change each of the divs overall size. You may want to adjust based on your final font sizing.
    .oneColElsCtrHdr #container {
              width: 46em;  /* this width will create a container that will fit in an 800px browser window if text is left at browser default font sizes */
              background: #FFFFFF;
              margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
              border: 1px solid #000000;
              text-align: left; /* this overrides the text-align: center on the body element. */
    .oneColElsCtrHdr #header {
              background: #DDDDDD;
              padding: 0 10px 0 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
    .oneColElsCtrHdr #header h1 {
              margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
              padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
    .oneColElsCtrHdr #mainContent {
              padding: 0 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
              background: #FFFFFF;
    .oneColElsCtrHdr #footer {
              padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
              background:#DDDDDD;
    .oneColElsCtrHdr #footer p {
              margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
              padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    -->
    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="oneColElsCtrHdr">
    <div id="container">
      <div id="header">
        <h1>Header</h1>
      <!-- end #header --></div>
      <div id="mainContent">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
            <ul>
              <li><a href="#">Item 1.1</a></li>
              <li><a href="#">Item 1.2</a></li>
              <li><a href="#">Item 1.3</a></li>
            </ul>
          </li>
          <li><a href="#">Item 2</a></li>
          <li><a class="MenuBarItemSubmenu" href="#">Item 3</a>
            <ul>
              <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
                <ul>
                  <li><a href="#">Item 3.1.1</a></li>
                  <li><a href="#">Item 3.1.2</a></li>
                </ul>
              </li>
              <li><a href="#">Item 3.2</a></li>
              <li><a href="#">Item 3.3</a></li>
            </ul>
          </li>
          <li><a href="#">Item 4</a></li>
        </ul>
        <h1> </h1>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,  odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse potenti. Fusce  varius urna id quam. Sed neque mi, varius eget, tincidunt nec, suscipit id,  libero. In eget purus. Vestibulum ut nisl. Donec eu mi sed turpis feugiat  feugiat. Integer turpis arcu, pellentesque eget, cursus et, fermentum ut,  sapien. Fusce metus mi, eleifend sollicitudin, molestie id, varius et, nibh.  Donec nec libero.</p>
        <h2>H2 level heading </h2>
        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
      <!-- end #mainContent --></div>
      <div id="footer">
        <p>Footer</p>
      <!-- end #footer --></div>
    <!-- end #container --></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    </body>
    </html>

  • Internet Explorer Problem with Spry Menu Bar

    http://www.cloud9industries.com/clients/jewelryworld/index4.html
    OK here we go
    #1) In IE, the toolbar doesn't appear with the same decreased
    opacity as it does in Firefox and Safari. I'm using a png
    background image with a transparent background and I've defined the
    background color the same as the lower layer's color. Any ideas?
    #2) THE BIG ISSUE - IE doesn't display the drop down portions
    of the menu properly as they display horizontally. If the cursor
    moves into the <li> from another <li> the menu displays
    as aforementioned. If the cursor moves into the <li> from
    outside the menu bar, the menu bar behaves properly.
    This is the first page I've done with a Spry menu bar as it
    seems the former navigation bar process has been removed from
    Dreamweaver. Any tips will be greatly appreciated.
    Thanks,
    cloud9industries

    Hi,
    I took a look over your page and I noticed that you are using
    a very old spry version 1.4. The current released version is Spry
    1.6 and contains some major bug fixes for Menu Bar widget.
    Please update to this last Spry version. You can download the
    new files from
    here.
    The problem with the transparent background is an IE6 problem
    which doesn't support transparent backgrounds. This problem is
    fixed on IE7 and I check it and it works there.
    Please let us know if you still have problems with MenuBar
    after updating it to the new version
    Thanks,
    Diana

  • Problem with Adobe Aplication Manger/Updater cs5

    i have just installed my CS5 Premium on my new (purchased used) macbook pro after a clean install (OSX 10.8.5)
    All the programs works fine but the Aplication Manger say there is updates for all the programs so i open it and and start the updates
    it downloads as it shud (according to the progress bar) but when i shud install the updates it gives me the following error messages:
    The following updates where unable to install. If you whiz to install these updates, pleas fix the problems below an retry:
      Adobe Bridge CS5 4.0.5 Update
      There was an error downloading this update. Please quit and try again later.
      Adobe Extension Manager CS5 5.0 Update
      There was an error downloading this update. Please quit and try again later.
      Adobe Illustrator CS5 15.0.2 Update
      There was an error downloading this update. Please quit and try again later.
      Adobe Pixel Bender Toolkit 2.5 Update
      There was an error downloading this update. Please quit and try again later.
      Adobe® InDesign® CS5 7.0.4 update
      There was an error downloading this update. Please quit and try again later.
      Dreamweaver CS5 11.0.4 Updater
      There was an error downloading this update. Please quit and try again later.
      Fireworks CS5 11.0.2 Update
      There was an error downloading this update. Please quit and try again later.
      Photoshop 12.0.4 update for Photoshop CS5
      There was an error downloading this update. Please quit and try again later.
      Photoshop Camera Raw 6.7 Update
      There was an error downloading this update. Please quit and try again later.
    I have tryde quitting and tryde again several times with no luck
    Anny ideers on how to fix this ?

    My Application Manager says somthing else. It's downloading the updates but then the installation fails. Normaly I can live without the upgrades, but my Camera RAW format is not compatible with the old version of Cameraw Raw and I realy need ad least this one.

  • Problem with using mouse scrollwheel within CS5?

    Hey all.  Just upgraded my PS from CS3 to CS5, and I seem to be running into issues with the scrollwheel on my mouse.
    When trying to use it from inside CS5 (say, inside a long 'Open...' window), it seems to lock up the entirety of Photoshop for a moment or two every few seconds.  Checking the net out there, it looks like there appeared to be a problem with mouse wheels, but that was supposedly fixed nearly a year ago.
    I checked for any updates or patches, but the most recent update I can see on the Adobe site is to 12.0.4, which has me doubly confused, as my copy of CS5 say that it is version 12.1, which, theoretically, is a more recent copy...?
    I can provide system info, etc. if needed, but since I have not found anything along these lines since a year ago, I'm guessing there's probably some simple thing I'm missing somewhere.
    Thanks in advance,
    Steve M

    You mean Photoshop plugins?  No, the version of CS5 I'm having issues with is fresh as a daisy, just digitally downloaded and run for the first time earlier today.  I think my old copy of CS3 has some, however, although since they are not being loaded into CS5 (presumably) I'm guessing those wouldn't be the culprit.  If this helps any:
      Model Name: Mac Pro
      Processor Name: Quad-Core Intel Xeon
      Processor Speed: 3.2 GHz
      L2 Cache (per processor): 12 MB
      Memory: 4 GB
      System Version: Mac OS X 10.5.8 (9L30)
    I'm using a Logitech Performance Mouse MX.
    Thanks,
    Steve M

  • Problem With File Crashing in Photoshop CS5

    Hello I have a design file that  I just created in Photoshop CS5 last night. I went in to do some editing today and it keeps craahing within a few seconds of being opened. I have never had this problem with a file before and I need it to turn in at work.  ANy helpful ideas out there on what may be happening? It's happened at least twenty times now....

    If you do a search, you will find several threads dealing with file corruption in CS5/ CS5.1. The long and short of it is, that the file is a goner, but feel free to try things like opening it in another program (Art Rage, Corel Painter, GIMP) or image viewer (XnView, ACDSee) to recover at least parts of it...
    Mylenium

  • Problem with Text tool in Photoshop CS5

    I just purchased PCS5 this morning and they told me that I should download the trial version till I get the actual CDs... I have Photoshop CS4 and never had any serious problems.  After downloading and installing CS5 it seems everything is working ok... however there are 2 problems...
    1. It does not interact with Bridge 4 (when I make changes in Bridge, CS5 does not see it)
    2. Any time I try to click on 'TEXT' tool icon, the application crushes... and I cant do anything... I have to restart the application.
    Dont care much about 1st problem, but can't do without the 2nd one....
    Any ideas?
    Thanks a million in advance

    Hi
    Have you tried following solutions?
    - update Photoshop to 12.0.4
    - remove bad & duplicated fonts and clear system font caches
    - update or uninstall 3rd party font management application
    - remove all 3rd party plugins including font management application plugin
    - launch Photoshop 32bit mode
    - upgrade your Mac OS
    If above solutions don't help, please contact me ([email protected]).
    Thanks,
    Kyoko

Maybe you are looking for

  • Problem with Application Login after upgrading to Oracle 11g

    I have a home-grown application with Oracle 10g database running under Windows XP Pro. Recently, I installed Oracle 11g and imported the application database from 10g to 11g (still want to keep the 10g running for a while). However, I now having prob

  • Oracle 9.2.0.6 client JDBC OCI driver compatibility issue with JRockit 1.4.

    I have weblogic server 8.1 sp4 running on Linux E3.0 using JRockit 1.4.2_5. I cannot seem to get the Oracle driver ojdbc14.jar to work. Yes I have added $ORACLE_HOME/bin to my classpath prior to any weblogic classes, I added $ORACLE_HOME/lib and $ORA

  • Trying to setup with all wireless

    I would like to set up my cable modem and linksys wireless router in a room with no computers. When I have a computer wired into the wireless router the wireless network operates fine. When I disconnect that computer and join wirelessly no computer c

  • Wont play music content

    my apple tv won't play the music shown it seams to be hung but i can see all the photos.the play button on the remote just wont start the songs but i can navigate through all the menus

  • Reorganisation of PIR's related

    Hi pp legends,         I am tring to use the Reorganisation of PIR's (MD74) transaction for my requirement. for example, there is a requirement of 3000 nos for june and 2000 nos for july, if i run mrp, one planned order for 3000 and another planed or