Spry vs. PVII

What to use..... the new Spry pop menu scheme or PVII Pop
Menu Magic?
Pros and cons??

"Jus Dreamin" <[email protected]> wrote in
message
news:f2pj9n$gim$[email protected]..
> Interesting, but not sure about all of this... a quicky
check using
> Firefox,
> with js disabled, yielded... yes, the upper level of the
menu, but no
> submenu
> items..... Will be looking at this more later. .......An
interesting
> point.
Actually, having submenus "work" when script is disabled is
not always the
perfect road to accessibility. Accessibility is, of course, a
very
subjective topic, but this article might prove insightful:
http://www.projectseven.com/tutorials/accessibility/pop_integrated/index.htm
Beyond that, there's no need to get into a contest between
free tools such
as Spry and commercial systems such as Pop Menu Magic. They
each have their
plusses and minuses and which to use depends on the the
goals, needs, and
coding abilities of the user - along with the need for rich
features,
automation, and, of course, one-on-one support.
That said, we also have a free menu that has proven quite
popular:
http://www.projectseven.com/tutorials/navigation/auto_hide/index.htm
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"

Similar Messages

  • Using SPRY colapsible menus

    I have playing around with using the SCM on a website. Seems
    to be great idea to turn about thirty one paragraph pages into just
    one. I think I have run into a problem though. The site has to be
    searchable. I ran the Google search from WebAssist on a SCM page I
    put on my site and it didn't find any of the text I searched for.
    So from my experiment it looks as tough text in a SPRY is not
    searchable.

    "Chris Leeds, MVP - FrontPage"
    <[email protected]> wrote in message
    news:g6qqga$16u$[email protected]..
    > Its not just SPRY, it's all that asynchronous stuff (at
    least that's what
    > I've been finding).
    Adobe has confused an already confusing issue, perhaps
    purposely, regarding
    Ajax and Spry :-)
    Ajax simply means that you are using JavaScript in the
    browser to read an
    xml file and load parts of that file into the document -
    that's Adobe's spry
    Ajax Framework. Spry "widgets" are simple JavaScript UI
    elements: menus,
    collapsing panels, accordions, etc. One has nothing to do
    with the other
    beyond the fact that you can populate the content of a
    widget, if you want,
    with data from an xml file.
    The ironic part of all this, is that when using Ajax to
    display content, the
    entire xml file is downloaded by the browser, though its
    content remains
    inaccessible until it is fetched by JavaScript.
    Disable JavaScript in the browser, and all content in the xml
    file is
    inaccessible, even though the file was actually downloaded.
    Search bots see absolutely nothing - whether script is
    disabled or not.
    A widget (spry or PVII) alone, however, is fully accessible
    whether or not
    script is enabled to both humans and search bots.
    The moral:
    Using Ajax, as it is available in Dreamweaver, has a price to
    pay - and that
    price is accessibility. Using a static iframe would, in fact,
    be more
    accessible, and arguably more usable.
    Using server-side scripting (PHP, for example) to download
    all the data that
    is contained in an xml file, hiding it, then using
    client-side scripting to
    show what you want on user demand, is more accessible,
    easier, and has the
    added benefit of being able to be fully accessible to both
    humans and bots
    if JavaScript is disabled in the browser.
    Al Sparber - PVII
    http://www.projectseven.com
    Fully Automated Menu Systems | Galleries | Widgets
    http://www.projectseven.com/go/Elevators

  • I lost the blue tab on my spry menu.

    I've saved my document and re-opened it, but still can't get the blue spry menu tab to show. Also can't see my submenus in the browser. It shows in my code. Here is my code.
    <table width="878" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="878" height="37" align="center" valign="middle" bgcolor="#D1D1D1">
           <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#">HOME</a>      </li>
          <li><a href="#" class="MenuBarItemSubmenu">ABOUT US</a>
            <ul>
              <li><a href="#">Become A Member</a></li>
              <li><a href="#">Photo Gallery</a></li>
              <li><a href="#">Contact Us</a></li>
    </ul>
          </li>
          <li><a class="MenuBarItemSubmenu" href="#">NEWS</a>
            <ul>
              <li><a href="#">Events</a>          </li>
              <li><a href="#">Job Listings</a></li>
              <li><a href="#">Hot Deals</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">EVENTS</a>
            <ul>
              <li><a href="#">News</a></li>
              <li><a href="#">Chamber Calendar</a></li>
              <li><a href="#">Community Calendar</a></li>
              <li><a href="#">Photo Gallery</a></li>
              <li><a href="#">Hot Deals</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">COMMUNITY</a>
            <ul>
              <li><a href="#">Scott Air Force Base</a></li>
              <li><a href="#">City of O'Fallon</a></li>
              <li><a href="#">O'Fallon Welcome Guide</a></li>
              <li><a href="#">O'Fallon-Shiloh Area Restaurant Guide</a></li>
              <li><a href="#" class="MenuBarItemSubmenu">Shiloh</a>
                <ul>
                  <li><a href="#">Village of Shiloh</a></li>
                  <li><a href="#">Village Services Guide</a></li>
                  <li><a href="#">Shiloh Community Calendar</a></li>
                </ul>
              </li>
              <li><a href="#">Events &amp; Reception Planning Guide</a></li>
              <li><a href="#">Relocation Packet Info</a></li>
              <li><a href="#">The Tourism Burea Illinois South</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">CONTACT US</a>
            <ul>
              <li><a href="#">Member Login</a></li>
              <li><a href="#">Member Directory</a></li>
              <li><a href="#">Community Business Info</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">JOIN US</a>
            <ul>
              <li><a href="#">Member Directory</a></li>
              <li><a href="#">Become A Member</a></li>
              <li><a href="#">Member Login</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">COMMITTEES</a>
            <ul>
              <li><a href="#">Board of Directors</a></li>
              <li><a href="#">Ambassadors</a></li>
              <li><a href="#">Star Investors</a></li>
              <li><a href="#">Member Directory</a></li>
            </ul>
          </li>
          <li><a href="#">PHOTO GALLERY</a></li>
    </ul></td>
      </tr>
    </table>
    @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
        list-style-type: none;
        cursor: default;
        width: 878px;
        white-space: nowrap;
        display: inline;
        position: relative;
        margin-top: 0px;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
    /* 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 auto;
        padding: 0;
        position: relative;
        text-align: left;
        cursor: default;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, Biondi;
        font-weight: normal;
        font-style: normal;
        font-size: 87%;
        white-space: nowrap;
        line-height: normal;
        width: auto;
        clear: none;
        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: auto;
        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
        text-align: left;
        white-space: nowrap;
        display: block;
        float: none;
        font-size: 100%;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, Biondi;
        font-style: normal;
        line-height: normal;
        font-weight: bolder;
        text-transform: none;
        background-color: transparent;
        width: auto;
        position: relative;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
        margin-top: -5%;
        margin-right: 0px;
        margin-bottom: 0;
        margin-left: 95%;
        position: absolute;
    /* 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-top-color: #021844;
        border-right-color: #021844;
        border-bottom-color: #021844;
        border-left-color: #021844;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        background-color: #021844;
        color: #FFF;
        text-decoration: none;
        border: 1px solid #FFF;
        text-align: left;
        padding-top: 0.5em;
        padding-right: 0.75em;
        padding-bottom: 0.5em;
        padding-left: 0.75em;
        white-space: nowrap;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        color: #036009;
        background-color: #FFF;
    /* 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
    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: none;
        background-position: 95% 50%;
        background-color: #021844;
    /* 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(SpryMenuBarRightHover.gif);
        background-position: 95% 50%;
        background-repeat: no-repeat;
    /* 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: none;
        background-position: 95% 50%;
        color: #036009;
        background-color: #FFF;
    /* 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;
    // SpryMenuBar.js - version 0.13 - Spry Pre-Release 1.6.1
    // Copyright (c) 2006. Adobe Systems Incorporated.
    // All rights reserved.
    // Redistribution and use in source and binary forms, with or without
    // modification, are permitted provided that the following conditions are met:
    //   * Redistributions of source code must retain the above copyright notice,
    //     this list of conditions and the following disclaimer.
    //   * Redistributions in binary form must reproduce the above copyright notice,
    //     this list of conditions and the following disclaimer in the documentation
    //     and/or other materials provided with the distribution.
    //   * Neither the name of Adobe Systems Incorporated nor the names of its
    //     contributors may be used to endorse or promote products derived from this
    //     software without specific prior written permission.
    // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
    // AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
    // IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
    // ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
    // LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
    // CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
    // SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
    // INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
    // CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
    // ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
    // POSSIBILITY OF SUCH DAMAGE.
    SpryMenuBar.js
    This file handles the JavaScript for Spry Menu Bar.  You should have no need
    to edit this file.  Some highlights of the MenuBar object is that timers are
    used to keep submenus from showing up until the user has hovered over the parent
    menu item for some time, as well as a timer for when they leave a submenu to keep
    showing that submenu until the timer fires.
    (function() { // BeginSpryComponent
    if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
    Spry.BrowserSniff = function()
        var b = navigator.appName.toString();
        var up = navigator.platform.toString();
        var ua = navigator.userAgent.toString();
        this.mozilla = this.ie = this.opera = this.safari = false;
        var re_opera = /Opera.([0-9\.]*)/i;
        var re_msie = /MSIE.([0-9\.]*)/i;
        var re_gecko = /gecko/i;
        var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
        var r = false;
        if ( (r = ua.match(re_opera))) {
            this.opera = true;
            this.version = parseFloat(r[1]);
        } else if ( (r = ua.match(re_msie))) {
            this.ie = true;
            this.version = parseFloat(r[1]);
        } else if ( (r = ua.match(re_safari))) {
            this.safari = true;
            this.version = parseFloat(r[2]);
        } else if (ua.match(re_gecko)) {
            var re_gecko_version = /rv:\s*([0-9\.]+)/i;
            r = ua.match(re_gecko_version);
            this.mozilla = true;
            this.version = parseFloat(r[1]);
        this.windows = this.mac = this.linux = false;
        this.Platform = ua.match(/windows/i) ? "windows" :
                        (ua.match(/linux/i) ? "linux" :
                        (ua.match(/mac/i) ? "mac" :
                        ua.match(/unix/i)? "unix" : "unknown"));
        this[this.Platform] = true;
        this.v = this.version;
        if (this.safari && this.mac && this.mozilla) {
            this.mozilla = false;
    Spry.is = new Spry.BrowserSniff();
    // Constructor for Menu Bar
    // element should be an ID of an unordered list (<ul> tag)
    // preloadImage1 and preloadImage2 are images for the rollover state of a menu
    Spry.Widget.MenuBar = function(element, opts)
        this.init(element, opts);
    Spry.Widget.MenuBar.prototype.init = function(element, opts)
        this.element = this.getElement(element);
        // represents the current (sub)menu we are operating on
        this.currMenu = null;
        this.showDelay = 250;
        this.hideDelay = 600;
        if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
            // bail on older unsupported browsers
            return;
        // Fix IE6 CSS images flicker
        if (Spry.is.ie && Spry.is.version < 7){
            try {
                document.execCommand("BackgroundImageCache", false, true);
            } catch(err) {}
        this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
        this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
        this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
        this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
        this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;
        this.hoverClass = 'MenuBarItemHover';
        this.subHoverClass = 'MenuBarItemSubmenuHover';
        this.subVisibleClass ='MenuBarSubmenuVisible';
        this.hasSubClass = 'MenuBarItemSubmenu';
        this.activeClass = 'MenuBarActive';
        this.isieClass = 'MenuBarItemIE';
        this.verticalClass = 'MenuBarVertical';
        this.horizontalClass = 'MenuBarHorizontal';
        this.enableKeyboardNavigation = true;
        this.hasFocus = false;
        // load hover images now
        if(opts)
            for(var k in opts)
                if (typeof this[k] == 'undefined')
                    var rollover = new Image;
                    rollover.src = opts[k];
            Spry.Widget.MenuBar.setOptions(this, opts);
        // safari doesn't support tabindex
        if (Spry.is.safari)
            this.enableKeyboardNavigation = false;
        if(this.element)
            this.currMenu = this.element;
            var items = this.element.getElementsByTagName('li');
            for(var i=0; i<items.length; i++)
                if (i > 0 && this.enableKeyboardNavigation)
                    items[i].getElementsByTagName('a')[0].tabIndex='-1';
                this.initialize(items[i], element);
                if(Spry.is.ie)
                    this.addClassName(items[i], this.isieClass);
                    items[i].style.position = "static";
            if (this.enableKeyboardNavigation)
                var self = this;
                this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
            if(Spry.is.ie)
                if(this.hasClassName(this.element, this.verticalClass))
                    this.element.style.position = "relative";
                var linkitems = this.element.getElementsByTagName('a');
                for(var i=0; i<linkitems.length; i++)
                    linkitems[i].style.position = "relative";
    Spry.Widget.MenuBar.KEY_ESC = 27;
    Spry.Widget.MenuBar.KEY_UP = 38;
    Spry.Widget.MenuBar.KEY_DOWN = 40;
    Spry.Widget.MenuBar.KEY_LEFT = 37;
    Spry.Widget.MenuBar.KEY_RIGHT = 39;
    Spry.Widget.MenuBar.prototype.getElement = function(ele)
        if (ele && typeof ele == "string")
            return document.getElementById(ele);
        return ele;
    Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
        if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
            return false;
        return true;
    Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
        if (!ele || !className || this.hasClassName(ele, className))
            return;
        ele.className += (ele.className ? " " : "") + className;
    Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
        if (!ele || !className || !this.hasClassName(ele, className))
            return;
        ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    // addEventListener for Menu Bar
    // attach an event to a tag without creating obtrusive HTML code
    Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
        try
            if (element.addEventListener)
                element.addEventListener(eventType, handler, capture);
            else if (element.attachEvent)
                element.attachEvent('on' + eventType, handler);
        catch (e) {}
    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
        var layer = document.createElement('iframe');
        layer.tabIndex = '-1';
        layer.src = 'javascript:""';
        layer.frameBorder = '0';
        layer.scrolling = 'no';
        menu.parentNode.appendChild(layer);
        layer.style.left = menu.offsetLeft + 'px';
        layer.style.top = menu.offsetTop + 'px';
        layer.style.width = menu.offsetWidth + 'px';
        layer.style.height = menu.offsetHeight + 'px';
    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
        var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
        while(layers.length > 0)
            layers[0].parentNode.removeChild(layers[0]);
    // clearMenus for Menu Bar
    // root is the top level unordered list (<ul> tag)
    Spry.Widget.MenuBar.prototype.clearMenus = function(root)
        var menus = root.getElementsByTagName('ul');
        for(var i=0; i<menus.length; i++)
            this.hideSubmenu(menus[i]);
        this.removeClassName(this.element, this.activeClass);
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
        return Spry.is.safari && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget));
    // showSubmenu for Menu Bar
    // set the proper CSS class on this menu to show it
    Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
        if(this.currMenu)
            this.clearMenus(this.currMenu);
            this.currMenu = null;
        if(menu)
            this.addClassName(menu, this.subVisibleClass);
            if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
                if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
                    menu.style.top = menu.parentNode.offsetTop + 'px';
            if(Spry.is.ie && Spry.is.version < 7)
                this.createIframeLayer(menu);
        this.addClassName(this.element, this.activeClass);
    // hideSubmenu for Menu Bar
    // remove the proper CSS class on this menu to hide it
    Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
        if(menu)
            this.removeClassName(menu, this.subVisibleClass);
            if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
                menu.style.top = '';
                menu.style.left = '';
            if(Spry.is.ie && Spry.is.version < 7)
                this.removeIframeLayer(menu);
    // initialize for Menu Bar
    // create event listeners for the Menu Bar widget so we can properly
    // show and hide submenus
    Spry.Widget.MenuBar.prototype.initialize = function(listitem, element)
        var opentime, closetime;
        var link = listitem.getElementsByTagName('a')[0];
        var submenus = listitem.getElementsByTagName('ul');
        var menu = (submenus.length > 0 ? submenus[0] : null);
        if(menu)
            this.addClassName(link, this.hasSubClass);
        if(!Spry.is.ie)
            // define a simple function that comes standard in IE to determine
            // if a node is within another node
            listitem.contains = function(testNode)
                // this refers to the list item
                if(testNode == null)
                    return false;
                if(testNode == this)
                    return true;
                else
                    return this.contains(testNode.parentNode);
        // need to save this for scope further down
        var self = this;
        this.addEventListener(listitem, 'mouseover', function(e){self.mouseOver(listitem, e);}, false);
        this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
        if (this.enableKeyboardNavigation)
            this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
            this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
    Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
        this.lastOpen = listitem.getElementsByTagName('a')[0];
        this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
        this.hasFocus = true;
    Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
        this.clearSelection(listitem);
    Spry.Widget.MenuBar.prototype.clearSelection = function(el){
        //search any intersection with the current open element
        if (!this.lastOpen)
            return;
        if (el)
            el = el.getElementsByTagName('a')[0];
            // check children
            var item = this.lastOpen;
            while (item != this.element)
                var tmp = el;
                while (tmp != this.element)
                    if (tmp == item)
                        return;
                    try{
                        tmp = tmp.parentNode;
                    }catch(err){break;}
                item = item.parentNode;
        var item = this.lastOpen;
        while (item != this.element)
            this.hideSubmenu(item.parentNode);
            var link = item.getElementsByTagName('a')[0];
            this.removeClassName(link, this.hoverClass);
            this.removeClassName(link, this.subHoverClass);
            item = item.parentNode;
        this.lastOpen = false;
    Spry.Widget.MenuBar.prototype.keyDown = function (e)
        if (!this.hasFocus)
            return;
        if (!this.lastOpen)
            this.hasFocus = false;
            return;
        var e = e|| event;
        var listitem = this.lastOpen.parentNode;
        var link = this.lastOpen;
        var submenus = listitem.getElementsByTagName('ul');
        var menu = (submenus.length > 0 ? submenus[0] : null);
        var hasSubMenu = (menu) ? true : false;
        var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];
        if (!opts[3])
            opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;
        var found = 0;
        switch (e.keyCode){
            case this.upKeyCode:
                found = this.getElementForKey(opts, 'y', 1);
                break;
            case this.downKeyCode:
                found = this.getElementForKey(opts, 'y', -1);
                break;
            case this.leftKeyCode:
                found = this.getElementForKey(opts, 'x', 1);
                break;
            case this.rightKeyCode:
                found = this.getElementForKey(opts, 'x', -1);
                break;
            case this.escKeyCode:
            case 9:
                this.clearSelection();
                this.hasFocus = false;
            default: return;
        switch (found)
            case 0: return;
            case 1:
                //subopts
                this.mouseOver(listitem, e);
                break;
            case 2:
                //parent
                this.mouseOut(opts[2], e);
                break;
            case 3:
            case 4:
                // left - right
                this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
                break;
        var link = opts[found].getElementsByTagName('a')[0];
        if (opts[found].nodeName.toLowerCase() == 'ul')
            opts[found] = opts[found].getElementsByTagName('li')[0];
        this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
        this.lastOpen = link;
        opts[found].getElementsByTagName('a')[0].focus();
            //stop further event handling by the browser
        return Spry.Widget.MenuBar.stopPropagation(e);
    Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
        var link = listitem.getElementsByTagName('a')[0];
        var submenus = listitem.getElementsByTagName('ul');
        var menu = (submenus.length > 0 ? submenus[0] : null);
        var hasSubMenu = (menu) ? true : false;
        if (this.enableKeyboardNavigation)
            this.clearSelection(listitem);
        if(this.bubbledTextEvent())
            // ignore bubbled text events
            return;
        if (listitem.closetime)
            clearTimeout(listitem.closetime);
        if(this.currMenu == listitem)
            this.currMenu = null;
        // move the focus too
        if (this.hasFocus)
            link.focus();
        // show menu highlighting
        this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
        this.lastOpen = link;
        if(menu && !this.hasClassName(menu, this.subHoverClass))
            var self = this;
            listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
    Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
        var link = listitem.getElementsByTagName('a')[0];
        var submenus = listitem.getElementsByTagName('ul');
        var menu = (submenus.length > 0 ? submenus[0] : null);
        var hasSubMenu = (menu) ? true : false;
        if(this.bubbledTextEvent())
            // ignore bubbled text events
            return;
        var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
        if(!listitem.contains(related))
            if (listitem.opentime)
                clearTimeout(listitem.opentime);
            this.currMenu = listitem;
            // remove menu highlighting
            this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
            if(menu)
                var self = this;
                listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
            if (this.hasFocus)
                link.blur();
    Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
        var child = element[sibling];
        while (child && child.nodeName.toLowerCase() !='li')
            child = child[sibling];
        return child;
    Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
        var found = 0;
        var rect = Spry.Widget.MenuBar.getPosition;
        var ref = rect(els[found]);
        var hideSubmenu = false;
        //make the subelement visible to compute the position
        if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
            els[1].style.visibility = 'hidden';
            this.showSubmenu(els[1]);
            hideSubmenu = true;
        var isVert = this.hasClassName(this.element, this.verticalClass);
        var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;
        for (var i = 1; i < els.length; i++){
            //when navigating on the y axis in vertical menus, ignore children and parents
            if(prop=='y' && isVert && (i==1 || i==2))
                continue;
            //when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
            if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
                continue;
            if (els[i])
                var tmp = rect(els[i]);
                if ( (dir * tmp[prop]) < (dir * ref[prop]))
                    ref = tmp;
                    found = i;
        // hide back the submenu
        if (els[1] && hideSubmenu){
            this.hideSubmenu(els[1]);
            els[1].style.visibility =  '';
        return found;
    Spry.Widget.MenuBar.camelize = function(str)
        if (str.indexOf('-') == -1){
            return str;   
        var oStringList = str.split('-');
        var isFirstEntry = true;
        var camelizedString = '';
        for(var i=0; i < oStringList.length; i++)
            if(oStringList[i].length>0)
                if(isFirstEntry)
                    camelizedString = oStringList[i];
                    isFirstEntry = false;
                else
                    var s = oStringList[i];
                    camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
        return camelizedString;
    Spry.Widget.MenuBar.getStyleProp = function(element, prop)
        var value;
        try
            if (element.style)
                value = element.style[Spry.Widget.MenuBar.camelize(prop)];
            if (!value)
                if (document.defaultView && document.defaultView.getComputedStyle)
                    var css = document.defaultView.getComputedStyle(element, null);
                    value = css ? css.getPropertyValue(prop) : null;
                else if (element.currentStyle)
                        value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
        catch (e) {}
        return value == 'auto' ? null : value;
    Spry.Widget.MenuBar.getIntProp = function(element, prop)
        var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
        if (isNaN(a))
            return 0;
        return a;
    Spry.Widget.MenuBar.getPosition = function(el, doc)
        doc = doc || document;
        if (typeof(el) == 'string') {
            el = doc.getElementById(el);
        if (!el) {
            return false;
        if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
            //element must be visible to have a box
            return false;
        var ret = {x:0, y:0};
        var parent = null;
        var box;
        if (el.getBoundingClientRect) { // IE
            box = el.getBoundingClientRect();
            var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
            var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
            ret.x = box.left + scrollLeft;
            ret.y = box.top + scrollTop;
        } else if (doc.getBoxObjectFor) { // gecko
            box = doc.getBoxObjectFor(el);
            ret.x = box.x;
            ret.y = box.y;
        } else { // safari/opera
            ret.x = el.offsetLeft;
            ret.y = el.offsetTop;
            parent = el.offsetParent;
            if (parent != el) {
                while (parent) {
                    ret.x += parent.offsetLeft;
                    ret.y += parent.offsetTop;
                    parent = parent.offsetParent;
            // opera & (safari absolute) incorrectly account for body offsetTop
            if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
                ret.y -= doc.body.offsetTop;
        if (el.parentNode)
                parent = el.parentNode;
        else
            parent = null;
        if (parent.nodeName){
            var cas = parent.nodeName.toUpperCase();
            while (parent && cas != 'BODY' && cas != 'HTML') {
                cas = parent.nodeName.toUpperCase();
                ret.x -= parent.scrollLeft;
                ret.y -= parent.scrollTop;
                if (parent.parentNode)
                    parent = parent.parentNode;
                else
                    parent = null;
        return ret;
    Spry.Widget.MenuBar.stopPropagation = function(ev)
        if (ev.stopPropagation)
            ev.stopPropagation();
        else
            ev.cancelBubble = true;
        if (ev.preventDefault)
            ev.preventDefault();
        else
            ev.returnValue = false;
    Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
        if (!optionsObj)
            return;
        for (var optionName in optionsObj)
            if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
                continue;
            obj[optionName] = optionsObj[optionName];
    })(); // EndSpryComponent

    You don't need to upgrade your software.  But if you're struggling with Spry, IMO you should cut your losses and switch to something better for the longrun.
    If you have a budget to work with, I highly recommend Project Seven's Pop-Menu Magic 3.  It's easy to use in DW CS4, 5, 6 or CC.  More importantly, it's bullet proof and works in all devices. 
    Pop-Menu  Magic3 by PVII (commercial DW extension)
    http://www.projectseven.com/products/menusystems/pmm3/index.htm
    If you don't have a budget to work with, you can roll your own menus with jQuery plugins.  A bit more effort on your part, but they perform better than Spry.
    jQuery Superfish
    http://users.tpg.com.au/j_birch/plugins/superfish/
    jQuery MegaMenu2
    DEMO:
    http://www.geektantra.com/projects/jquery-megamenu-2/
    DOWNLOAD:
    http://code.google.com/p/jquery-megamenu/
    Nancy O.

  • Can I get around using Spry for pop-up menus?

    Members of our organization tend to be older and not so quick
    to update their software or browsers. We're trying to develop a new
    site, and although we've had CS3 here since last year, it just
    grayed out our ability to use "Show pop-up menu" as an option this
    week.
    According to Adobe, Spry is only supported on the following
    browsers: Firefox, IE6 and higher, Safari 2, and Opera 9.
    According to our web stats, our users use: Netscape 4.x
    (32.92%), MSIE 6.x (23.08%), Netscape 7x. (8.62%), AOL (4.16%),
    Firefox 1.x (0.34%), Opera 3.x (0.13%), *Unknown (29.08%)
    I can't use a function that only 25% of my site visitors can
    see!
    Any suggestions? I'm desperate!

    > We're trying to develop a new site, and although we've
    > had CS3 here since last year, it just grayed out our
    ability to use "Show
    > pop-up menu" as an option this week.
    This has always been the case. CS3 will only enable that
    option on a page
    that already has one of those nasty menus on it. In other
    words, the effect
    has been taken on a long walk off a short pier. To see why I
    refer to these
    as 'nasty', read this -
    http://www.losingfight.com/blog/2006/08/11/the-sordid-tale-of-mm_menufw_menujs/
    There are so MANY MUCH BETTER ways to do these kinds of
    things -
    Check the uberlink and MacFly tutorials at PVII -
    http://www.projectseven.com/
    and the Navbar tutorial/articles at Thierry's place
    http://tjkdesign.com/articles/dropdown/
    Or this one (more recent article):
    http://tjkdesign.com/articles/Pure_CSS_Dropdown_Menus.asp
    Or to get it done fast, go here -
    http://www.projectseven.com/tutorials/navigation/auto_hide/index.htm
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "Remps" <[email protected]> wrote in message
    news:fr6gil$hc7$[email protected]..
    > Members of our organization tend to be older and not so
    quick to update
    > their
    > software or browsers. We're trying to develop a new
    site, and although
    > we've
    > had CS3 here since last year, it just grayed out our
    ability to use "Show
    > pop-up menu" as an option this week.
    >
    > According to Adobe, Spry is only supported on the
    following browsers:
    > Firefox,
    > IE6 and higher, Safari 2, and Opera 9.
    >
    > According to our web stats, our users use: Netscape 4.x
    (32.92%), MSIE 6.x
    > (23.08%), Netscape 7x. (8.62%), AOL (4.16%), Firefox 1.x
    (0.34%), Opera
    > 3.x
    > (0.13%), *Unknown (29.08%)
    >
    > I can't use a function that only 25% of my site visitors
    can see!
    >
    > Any suggestions? I'm desperate!
    >

  • Spry vertical menu not working

    I posted this before and still haven't solved so I am going to try again. .
    My Vertical Spry menu bar won't show the submenu items in ANY browser.  I have tried completely deleting everything involved with that menu and starting over and still can't get it to work (it did at one time so I'm not sure what has happened to it)  BTW, when I view it in DW Live view it looks fine, but once I upload, it won't work.  I also have horizonal spry menu and it works fine.
    Here is my menu:
    <ul id="MenuBar3" class="MenuBarVertical">
         <li><a title="sports">Sports</a>
        <ul>
          <li><a href="../Parks/youthrec.html">Youth Sports</a></li>
          <li><a href="../Parks/adultrec.html">Adult Sports</a></li>
          <li><a href="../Parks/tennisladder.html">Tennis Ladder</a></li>
          </ul>
        </li>
      <li> <a href="../Parks/communityevents.html">Events</a></li>
      <li><a href="../Document_Center/Parks/Scholarship_info.pdf">MPRD Scholarship</a></li>
      <li> <a href="../Parks/facilities.html">Facilities</a></li>
      <li> <a href="aquaticcenter.html">Aquatic Center</a>        </li>
      <li> <a href="althleticcomplex.html">Athletic Complex</a></li>
      <li><a title="Parks">Parks</a>
        <ul>
      <li> <a href="rothwellpark.html">Rothwell Park</a>
        <ul>
      <li> <a href="../Parks/campground.html">Campground</a></li>
      <li><a href="../Parks/dogpark.html">Dog Park</a></li>
      <li> <a href="../Parks/lake.html">Lakes</a></li>
      <li> <a href="../Document_Center/Parks/Rothwell_Park_Map_2009.pdf">Map of Rothwell Park</a></li>
      <li> <a href="../Parks/skatepark.html">Skate Park</a></li>
      <li> <a href="../Parks/minitrain.html">Miniature Train</a></li>
      <li> <a href="../Parks/candycanecity.html">Candy Cane City</a></li>
      <li><a href="../Parks/discgolf.html">Disc Golf</a></li>
      <li><a href="../Parks/War Memorials.html">War Memorial</a></li>
          </ul>
        </li>
          <li> <a href="areaparks.html">Other Area Parks</a></li></ul></li>
      <li><a href="../Projects/Parks.html">Parks &amp; Recreation Projects</a></li>
      <li> <a href="../Parks/scrapbook.html">Scrapbook</a> </li>
      <li><a href="../Parks/parksboard.html">Park Board</a></li>
      <li> <a href="../Parks/parksstaff.html">Staff Directory</a>
        <ul>
          <li><a href="../Parks/parksdirector.html">Director's Message</a></li>
      </ul>
        </li>
      <li><a href="../Parks/tennisladder.html">Tennis Ladder</a></li>
      <li><a href="../Parks/tickets.html">Ticket Consignment</a></li>
      <li> <a href="../Parks/employment.html">Employment</a> </li>
      <li><a href="../Parks/parksvolunteers.html">Volunteer/Donate</a></li>
    </ul>
    Here is my css file:
    @charset "UTF-8";
    /* SpryMenuBarVertical.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, a fixed width box with no margin or padding */
    ul.MenuBarVertical
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: 9em;
        margin-top: 10px;
        margin-left: 20px;
    /* 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 same fixed width as parent */
    ul.MenuBarVertical li
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 9em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarVertical ul
        margin: -5% 0 0 95%;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: absolute;
        z-index: 1020;
        cursor: default;
        width: 9em;
        left: -1000em;
        top: 0;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarVertical ul.MenuBarSubmenuVisible
        left: 0;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarVertical ul li
        width: 9em;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Outermost menu container has borders on all sides */
    ul.MenuBarVertical
        border: 1px solid #CCC;
    /* Submenu containers have borders on all sides */
    ul.MenuBarVertical ul
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarVertical a
        display: block;
        cursor: pointer;
        background-color: #FFF;
        padding: 0.5em 0.75em;
        color: #333;
        text-decoration: none;
        font-family: Tahoma, Geneva, sans-serif;
        font-weight: bold;
        font-size:12px;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
        background-color: #fff;
        color: #999;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
        background-color: #fff;
        color: #999;
    ul.MenuBarVertical li
        display: block;
        cursor: pointer;
        background-color: #FFF;
        padding: 0.5em 0.75em;
        color: #333;
        text-decoration: none;
        font-family: Tahoma, Geneva, sans-serif;
        font-weight: bold;
        font-size:12px;
    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.MenuBarVertical a.MenuBarItemSubmenu
        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.MenuBarVertical 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.MenuBarVertical 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.MenuBarVertical li.MenuBarItemIE
            display: inline;
            f\loat: left;
            background: #FFF;
    If anyone has ANY ideas I would love to hear them!  As I said, at one time it worked great, now I can't get the submenu's to work.

    Spry Menus 10 Commandments
    http://www.dwcourse.com/dreamweaver/ten-commandments-spry-menubars.php
    Fixing Spry Menus 1.6.1
    http://www.projectseven.com/testing/adobe-bugs/spry-menus/
    Personally, I don't use Spry menus.  I think you could find a much better menu system from any of the links below.
        Pop-Menu  Magic2 by PVII (DW extension purchase)
        http://www.projectseven.com/products/menusystems/pmm2/index.htm
        jQuery Superfish
        http://users.tpg.com.au/j_birch/plugins/superfish/
        jQuery Mega Menus 
        http://www.javascriptkit.com/script/script2/jkmegamenu.shtml
        CSS3 Dropdown Menus
        http://www.red-team-design.com/css3-dropdown-menu
        10 Responsive Menus
        http://speckyboy.com/2012/08/29/10-responsive-navigation-solutions-and-tutorials/
    Nancy O.

  • Spry menu bar widget

    Having followed instructions from web sites and
    books I still can't modify the rollover background colour away from
    the purple. It must be something basic but I'm stumped. I can
    change the style of the menu bar in other ways - text, colour etc
    but whatever I try, when I preview in Safari I still get the purple
    rollover colour. Help

    You cannot center a CSS horizontal list unless you assign
    fixed widths to
    each root level LI and then you can use Joe's suggestion by
    assigning a
    width to the outer wrapper that is equal to the aggregate of
    the root LI
    widths (adjusted for box-model). If the root level LIs are
    set to an auto
    width, then you will be able to center the menu construct but
    the first LI
    will be aligned at the left edge of the centered box.
    Al Sparber - PVII
    http://www.projectseven.com
    Extending Dreamweaver - Nav Systems | Galleries | Widgets
    Authors: "42nd Street: Mastering the Art of CSS Design"
    "letponys" <[email protected]> wrote in
    message
    news:flk3v7$os6$[email protected]..
    >I know I must be missing something simple but where
    within the Spry css can
    >I make the menu bar center on the page. Thanks for your
    help.

  • Spry Menu and IE Issue (Hover Font Size)

    I'm not able to figure out why the hover focus setting works fine with Firefox or Chrome, but I can't find a setting in the CSS to ensure the value for the font on a hover within IE remains fixed. on a hover, the font size increases slighly in IE and pushes menu out of alignment very slightly. I was able to keep the hover size fixed in Firefox and Chrome via the CSS values for the spry, but not sure why IE is doing this and if there is a setting specific to IE that would allow me to keep the hover font size fixed, but not change the values in Firefox/Chrome. Is there any way to lock in the hover value using CSS for the font so in IE it remains constant?
    http://oregonstate.edu/~labellec/CDfiles/index.html
    Page is under development, but if you open it up in IE, the menu hover causes too much movement. I'm new to CS4, so, any help appreciated.
    Thanks,
    Chris

    Perhaps you could adapt the techniques used here for your
    Spry menu:
    http://www.projectseven.com/products/menusystems/pmm2/see-through.htm
    Al Sparber - PVII
    http://www.projectseven.com
    The Finest Dreamweaver Menus | Galleries | Widgets
    http://www.projectseven.com/go/pop
    The Ultimate DW Menu System
    "Webkil" <[email protected]> wrote in
    message
    news:gnmh2l$dvo$[email protected]..
    >I have tried this. I want a transparent background no
    colour. As soon as I
    >add transparent IE comes up with the word false in the
    sub menus.

  • Spry Accordion Issue

    Spry Accordion appears to snap shut to its default setting
    the moment you use it to navigate to a linked page.
    I want to keep the accordion open on the page that it
    represents rather than having the user open up the accordion each
    time they wish to navigate to the next page.
    Can this be done - if of course I have explained myself well
    enough which frankly i doubt!
    Thanks in advance
    Neil

    Al Sparber- PVII wrote:
    > "eclipsme" <[email protected]> wrote in message
    > news:fcjsoh$3m1$[email protected]..
    >> Al Sparber- PVII wrote:
    >>> "skipiouk" <[email protected]>
    wrote in message
    >>> news:fciqsg$t8i$[email protected]..
    >>>> Thanks Al
    >>>> is there no way to do this inside CS3 or is
    the purchase of piece of
    >>>> software necessary?
    >>>> Neil
    >>>
    >>> I don't know. We do not use Spry because it's
    just not compatible
    >>> with our approach towards markup, CSS, or
    scripting. If you are a
    >>> casual web developer and don't have a
    professional budget, perhaps
    >>> someone who is "into" Spry can help you hack a
    solution.
    >>>
    >>>
    >> See if this helps.
    >>
    >>
    http://labs.adobe.com/technologies/spry/articles/accordion_overview/
    >>
    >> Harvey
    >
    > Hi Harvey,
    >
    > I don't need "help" understanding how Spry widgets work.
    We have
    > analyzed the code and methodology and it's just an
    approach that we
    > would never take, hence we have no interest in it.
    Perhaps you meant
    > your post to be in response to someone else and not me
    >
    >
    Right, Al. Niel was asking the question. Your's wasn't the
    only post.
    Sorry if you got confused. The link provides information on
    configuring
    the widget. I thought this could be useful to Niel.
    Harvey

  • Spry Navbar Dropdown Under swf file image

    I've built an intranet page that works fine in IE but not in
    Netscape and Firefox. The spry horizontal drop down falls under the
    swf file in Netscape and Firefox, making the drop down items
    inaccessible. I've put z-indexes on the navbar, flash component and
    the frame around the flash piece. The navbar only falls under the
    flash component.
    Any suggestions? Thanks.

    It's not a z-index issue.
    All Active content on a page will always rise to the top, so
    to speak,
    including Flash, certain form elements, Java applets, and
    Active X controls.
    This means that each of these will poke through layers. There
    is not a good
    cross-browser/platform reliable way to solve this issue, but
    if you can be
    confident in your visitors using IE 5+ or NN6+, then you can
    use the Flash
    wmode parameter (however, Safari does not support this
    properly!).
    PVII article:
    http://www.projectseven.com/support/answers.asp?id=127
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "sdamico" <[email protected]> wrote in
    message
    news:fqhbdi$7rn$[email protected]..
    > I've built an intranet page that works fine in IE but
    not in Netscape and
    > Firefox. The spry horizontal drop down falls under the
    swf file in
    > Netscape
    > and Firefox, making the drop down items inaccessible.
    I've put z-indexes
    > on
    > the navbar, flash component and the frame around the
    flash piece. The
    > navbar
    > only falls under the flash component.
    >
    > Any suggestions? Thanks.
    >

  • Spry toolbar in dreamweaver cs6? is there one?

    All in the title

    Hi,
    because we are becoming so detailed, here some more links
    Examples
    http://users.tpg.com.au/j_birch/plugins/superfish/examples/
    http://www.egrappler.com/a-stylo-modern-jquery-accordion-akordeon/
    http://craigsworks.com/projects/simpletip/
    http://calebjacob.com/tooltipster/
    Tutorials:
    http://speckyboy.com/2012/08/29/10-responsive-navigation-solutions-and-tutorials/
    http://try.jquery.com/
    http://learn.jquery.com/
    https://tutsplus.com/course/30-days-to-learn-jquery/
    http://www.w3schools.com/jquery/
    If you have a budget to work with, get PVII's Pop-Menu Magic2.
    http://www.projectseven.com/products/menusystems/pmm2/
    And to complete here the good old SPRY of  Spry Samples.
    Hans-Günter
    @Jon Fritz II: Hint is arrived, thanks!

  • What replaces the CS6 spry menu bar in dreamweaver creative cloud 2014?

    Hi,
    Previously I used Dreamweaver CS6 and the spry menu bar widget (horizontal).  I do not see this in Dreamweaver CC 2014.  I am looking around in the Insert Panel (jQuery UI) but don't think a spry menu bar equivalent is listed.
    Is there such an equivalent built into Dreamweaver CC 2014?

    Basic CSS drop-menu
    CSS Menu - JSFiddle
    Advanced drop-menu with CSS gradients & transitions
    CSS Horizontal Drop-Menu - JSFiddle
    PVII's Pop-Menu Magic3 (commercial DW extension)
    http://www.projectseven.com/products/menusystems/pmm3/index.htm
    jQuery Superfish
    http://users.tpg.com.au/j_birch/plugins/superfish/
    Responsive Iconic
    http://www.dynamicdrive.com/style/csslibrary/item/responsive_iconic_menu/
    Responsive Hybrid
    http://www.dynamicdrive.com/dynamicindex1/responsivehybridmenu/index.html
    Nancy O.

  • Section 508 Compliance - Spry Menu

    I work for the government and am wondering if you could help
    me figure out how I can (or if it's even possible) make the spry
    menu features in Dreamweaver Section 508 Compliant, so that people
    who have screen readers or Java Script turned off would still be
    able to access the spry menu items. When we run the pages that have
    spry menus through Dreamweaver's accessibility report it just
    relays to us the fact that we are using Java script and we need to
    provide a "noscript" tag. Do you have any ideas on how we could
    accommodate this in our new web site design?
    Thanks! Eleanor

    See if this article helps you:
    http://www.projectseven.com/tutorials/accessibility/pop_integrated/index.htm
    Al Sparber - PVII
    http://www.projectseven.com
    Fully Automated Menu Systems | Galleries | Widgets
    http://www.projectseven.com/go/Elevators
    "luchenburg" <[email protected]> wrote in
    message
    news:g684j9$7jr$[email protected]..
    >I work for the government and am wondering if you could
    help me figure out
    >how
    > I can (or if it's even possible) make the spry menu
    features in
    > Dreamweaver
    > Section 508 Compliant, so that people who have screen
    readers or Java
    > Script
    > turned off would still be able to access the spry menu
    items. When we run
    > the
    > pages that have spry menus through Dreamweaver's
    accessibility report it
    > just
    > relays to us the fact that we are using Java script and
    we need to provide
    > a
    > "noscript" tag. Do you have any ideas on how we could
    accommodate this in
    > our
    > new web site design?
    >
    > Thanks! Eleanor
    >
    >
    >

  • Spry Slide Effect problem in IE 7 only

    I am using the Spry Slide Effect as a way of initially hiding
    a drop down menu:
    Click on menu of products:
    http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
    I use:
    .hideInitially{
    display: none;
    as recommended here though there is no working example using
    display: none; only visibility: hidden
    http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
    Using initial state of dispay: none it displays NOTHING! Is
    this a bug in IE 7?
    Anyone come across this problem.
    Anyone got a fix?
    Thanks
    Rich

    High Rich,
    You were on the right track with EPM. Here's how it works:
    http://www.projectseven.com/testing/customers/pow32/
    All you do is insert a single panel EPM inside TopMenuWrapper
    set to have
    all panels close and with gradual stop animation and using
    the basic style
    theme.
    Then you set the trigger DIV to display: none !important; and
    to remove all
    borders.
    .p7EPM05 .p7epm_trigs {
    overflow: hidden;
    margin-bottom: 12px;
    display: none !important;
    Then "un-style" the EPM content DIV so it picks up your
    colors and
    attributes:
    .p7EPM05 .p7epm_content {
    padding: 12px 24px;
    line-height: 1.5em;
    border: 0;
    Then select your "Menu of Products" link and use the built-in
    EPM control
    behaviors (available GUI in behaviors panel) to assign an EPM
    Trigger
    Control to the link, which will then look like this:
    <a href="#"
    onclick="P7_EPMctl('p7EPMtrg1_1','trigger')">Menu of
    Products</a>
    That's it.
    Al Sparber - PVII
    http://www.projectseven.com
    The Finest Dreamweaver Menus | Galleries | Widgets
    http://www.projectseven.com/go/pop
    The Ultimate DW Menu System
    "RICH POW" <[email protected]> wrote in
    message
    news:gms1c0$rpj$[email protected]..
    >I am using the Spry Slide Effect as a way of initially
    hiding a drop down
    >menu:
    >
    > Click on menu of products:
    >
    http://www.adelantedesign.co.uk/clients/showpiece/menu.asp
    >
    > I use:
    > .hideInitially{
    > display: none;
    > }
    > as recommended here though there is no working example
    using display:
    > none;
    > only visibility: hidden
    >
    >
    http://labs.adobe.com/technologies/spry/samples/effects/slide_sample.html
    >
    > Using initial state of dispay: none it displays NOTHING!
    Is this a bug in
    > IE
    > 7?
    > Anyone come across this problem.
    >
    > Anyone got a fix?
    >
    > Thanks
    > Rich
    >

  • Spry tabs nested in accordion on IE.

    I am trying to put a tabbed panel in an accordion panel. In
    IE6 and I believe 7 as well, the tabs do not hide. Everything looks
    fine in FF and Safari. Any ideas on fixing this?

    This example, though for our widgets, might help with the
    spry issue.
    http://www.projectseven.com/products/tools/accordion/tweaks/with_tpm/index2.htm
    Essentially, what you do is make each containing DIV for each
    accordion
    content panel relative.
    Al Sparber - PVII
    http://www.projectseven.com
    Fully Automated Menu Systems | Galleries | Widgets
    Elevating Dreamweaver Widgets to a Higher Level
    "Josh Rawls" <[email protected]> wrote in
    message
    news:ft0go1$h8m$[email protected]..
    >I am trying to put a tabbed panel in an accordion panel.
    In IE6 and I
    >believe 7 as well, the tabs do not hide. Everything looks
    fine in FF and
    >Safari. Any ideas on fixing this?

  • Odd spry menu / css positioning

    Hi folks,
    Working on a site with a Spry menu - looks as expected in IE,
    but totally
    out of whack in FF and Safari. Any suggestions to what I'm
    missing?
    http://www.applicationdynamics.com/Clients/pwj/
    I'm sure I'm just neglecting to configure the CSS correctly
    but haven't
    found the trick yet.
    Thanks!
    Lawrence
    Cartweaver.com

    "Lawrence *Adobe Community Expert*"
    <[email protected]> wrote in
    message news:g915h6$t2o$[email protected]..
    > Never mind.... Got it.
    Hi Lawrence,
    Maybe you got the part of it you caught as an issue, but it
    still doesn't
    work very well in IE7. The links are not being treated as
    blocks so unless
    you are moused over the actual text in a submenu, it will
    snap shut.
    I'd recommend a better menu, but you should be able to fix
    this easily
    enough and so long as there are not third-level flyouts,
    usability with Spry
    is OK.
    Al Sparber - PVII
    http://www.projectseven.com
    Fully Automated Menu Systems | Galleries | Widgets
    http://www.projectseven.com/go/Elevators

Maybe you are looking for

  • Error while applying patch MLR#4

    hi, I am getting error while applying patch MLR#4. Can you please let me know whats error can be resolved? Please see below the snapshots from log file. Thanks, Vaibhav Execute perf_wid_pid_pcid.sql Error: Abort transaction java.lang.NullPointerExcep

  • My I iphone 4 isn't being recognized by any computer.

    i have checked mulitple cables and computer and the iPhone doesn't shoe under my computer althou it does charge when i plug it to the computers usb

  • Web service client type

    Hi, I am new to web services. I need to write a web service client that invokes a web service method. The method takes complex types as parameter and returns a complex type.what kind of client(static stub, dynamic proxy or DII) should I use to invoke

  • Acrobat Pro XI not opening

    I am running CC Suite on a MacBook Pro ver. 10.8.5. I was updating acrobat when I got an error that the uddate did not complete. When I returned to the desktop, the icon had changed and I could no longer drop a file to acrobat. I ran Cleaner and it c

  • All fields with !Format event blank when printing

    A client asked for assistance creating a new shipping label template with Adobe Output Designer 5.5, a program I've not used before. I had no problem creating the layout, and slapping the necessary fields on there (they had a few other templates I wa