Spry menu accordion

HI! I'm using the spry accordion in one of my web projects.
Can somebody help me out? Whenever I click on a link, the spry menu
goes back to its original position. I would like to have the menu
open to where the active link is... is that possible?

Well.....I found a solution. But it's a cure with nasty side
effects.
Ok...if I change this:
if(isie)
if(this.hasClassName(this.element, "MenuBarVertical"))
this.element.style.position = "relative";
var linkitems = this.element.getElementsByTagName('a');
for(var i=0; i<linkitems.length; i++)
linkitems
.style.position = "relative";
for this:
if(isie)
if(this.hasClassName(this.element, "MenuBarVertical"))
this.element.style.position = "static";
var linkitems = this.element.getElementsByTagName('a');
for(var i=0; i<linkitems.length; i++)
linkitems.style.position = "static";
then the scrollbars appear. But the submenus don't appear
anymore.
Soo....keep on keepin' on. I'll post any findings.

Similar Messages

  • Spry Menu Bar and Spry Accordians quit working.

    I for the life of me can not figure out why these quit working both the spry menu bar and my accordians quit working,  .  Here is the site I am working on http://www.online-antiques-and-collectibles.com
    The pages are in .php so http://www.online-antiques-and-collectibles.com/index.php
    I use a dell PC with windows 7.  Godaddy is the webserver.  I am also using a template.  The site pages are HTML5 and PHP. 
    so someone please help me find out the bug I did to this thing.  I really have too much work into this as of now to start over with a new template page if I do not have to?
    Any suggestions would be great.  Thanks in advance for your help.
    Here is the code from my index page
    <!doctype html>
    <html><!-- InstanceBegin template="/Templates/deco.dwt.php" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta charset="utf-8">
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>Untitled Document</title>
    <!-- InstanceEndEditable -->
    <!-- InstanceBeginEditable name="head" -->
    <!-- InstanceEndEditable -->
    <link href="styles.css" rel="stylesheet" type="text/css">
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css">
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    </head>
    <body>
    <div class="container">
      <div class="header">
        <header><img src="Assets/Images/DECO BANNER.fw.png" width="954" height="228" alt="Deco Designs and Collectibles Header"></header>
      </div>
      <div class="Nav">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="index.php">Home</a></li>
          <li><a href="#" class="MenuBarItemSubmenu">Browse</a>
            <ul>
              <li><a href="antiques/antique-categories.php">Antique Categories</a></li>
              <li><a href="collectibles/collectible-categories.php">Collectible Categories</a></li>
            </ul>
          </li>
          <li><a href="search.php" title="Search Deco Designs and Collectibles Website">Search</a></li>
          <li><a href="cost.php" title="What Deco Designs and Collectibles Cost">Costs</a></li>
    <li><a href="register.php" title="Register for a Deco Designs and Collectibles Seller Account">Register</a></li>
          <li><a href="login.php" title="Login to your Deco Designs and Collectibles Sellers Account">Login</a></li>
          <li><a href="contact-us.php" title="Contact Us at Deco Designs and Collectibles">Contact Us</a></li>
          <li><a href="about-us.php" title="About Us at Deco Designs and Collectibles">About Us</a></li>
        </ul>
      </div>
      <div class="sidebar1">
        <div><strong>ANTIQUES</strong></div>
        <div id="Accordion1" class="Accordion" tabindex="0">
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Antiquities Middle Ages</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/antiquities-middle-ages-antiques/byzantine-antiques/byzantine-antiquities. php" title="Byzantine Antiques">Byzantine Antiquities</a></p>
    <p><a href="antiques/antiquities-middle-ages-antiques/celtic-antiques/celtic-antiquities.php" title="Celtic Antiques">Celtic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/egyptian-antiques/egyptian-antiquities.ph p" title="Egyptian Antiques">Egyptian Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/far-eastern-antiques/far-eastern-antiquit ies.php" title="Far Eastern Antiques">Far Eastern Antiquities </a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/greek-antiques/greek-antiquities.php" title="Greek Antiques">Greek Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/holy-land-antiques/holy-land-antiquities. php" title="Holy Land Antiques">Holy Land Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/islamic-antiques/islamic-antiquities.php" title="Islamic Antiques">Islamic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/near-eastern-antiques/near-eastern-antiqu ities.php" title="Near Eastern Antiques">Near Eastern Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/neolithic-antiques/neolithic-antiquities. php" title="Neolithic and Paleolithic Antiques">Neolithic and Paleolithic Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/reproduction-antiquities/reproduction-ant iquities.php" title="Reproduction Antiquities">Reproduction Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/roman-antiques/roman-antiquities.php" title="Roman">Roman Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/south-italian-antiques/south-italian-anti quities.php" title="South Italian Antiques">South Italian Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/the-americas-antiques/the-americas-antiqu ities.php" title="The Americas Antiques">The Americas Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/viking-antiques/viking-antiquities.php" title="Viking Antiques">Viking Antiquities</a></p>
              <p><a href="antiques/antiquities-middle-ages-antiques/price-guides-and-publications-for-antiqui ties-middle-ages/price-guides-and-publications-for-antiquities-middle-ages.php" title="Price Guides and Publications for Antiquities Middle Ages">Price Guides and Publications for Antiquities Middle Ages</a></p>
    <p><a href="antiques/antiquities-middle-ages-antiques/other-antiquities/other-antiquities-middl e-ages.php" title="Other Antiquities Middle Ages Antiques">Other - Antiquities Middle Ages</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Architectural and Garden Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/architectural-and-garden-antiques/alabaster/alabaster-architectural-and-ga rden-antiques.php" title="Antique Alabaster">Alabaster - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/brass/brass-architectural-and-garden-ant iques.php" title="Antique Brass">Brass - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/bronze/bronze-architectural-and-garden-a ntiques.php" title="Antique Bronze">Bronze - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/cast-iron/cast-iron-architectural-and-ga rden-antiques.php" title="Antique Cast Iron">Cast Iron - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/chrome/chrome-architectural-and-garden-a ntiques.php" title="Antique Chrome">Chrome - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/copper/copper-architectural-and-garden-a ntiques.php" title="Antique Copper">Copper - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/crystal/crystal-architectural-and-garden -antiques.php" title="Antique Crystal">Crystal - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/glass/glass-architectural-and-garden-ant iques.php" title="Glass">Glass - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/gold/gold-architectural-and-garden-antiq ues.php" title="Antique Gold">Gold - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/iron/iron-architectural-and-garden-antiq ues.php" title="Antique Iron">Iron - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/marble/marble-architectural-and-garden-a ntiques.php" title="Marble">Marble - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/mixed-materials/mixed-materials-architec tural-and-garden-antiques.php" title="Mixed Material Antiques">Mixed Materials - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/pewter/pewter-architectural-and-garden-a ntiques.php" title="Antique Pewter">Pewter - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/porcelain/porcelain-architectural-and-ga rden-antiques.php" title="Antique Porcelain">Porcelain - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/silver/silver-architectural-and-garden-a ntiques.php" title="Antique Silver">Silver - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/steel/steel-architectural-and-garden-ant iques.php" title="Antique Steel">Steel - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/stone/stone-architectural-and-garden-ant iques.php" title="Antique Stone">Stone - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/synthetic/synthetic-architectural-and-ga rden-antiques.php" title="Synthetic Antiques">Synthetic - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/tole/tole-architectural-and-garden-antiq ues.php" title="Antique Tole">Tole - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/wood/wood-architectural-and-garden-antiq ues.php" title="Antique Wood">Wood - Architectural and Garden Antiques</a></p>
              <p><a href="antiques/architectural-and-garden-antiques/other-architectural-and-garden-antiques/ other-architectural-and-garden-antiques.php" title="Other Architectural and Garden Antiques">Other - Architectural and Garden Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Asian Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/asian-antiques/amulets/amulets-asian-antiques.php" title="Antique Asian Amulet">Amulets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/armor/armor-asian-antiques.php" title="Antique Asian Armor">Armor - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/baskets/baskets-asian-antiques.php" title="Antique Asian Basket">Baskets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bells/bells-asian-antiques.php" title="Antique Asian Bell">Bells - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bowls/bowls-asian-antiques.php" title="Antique Asian Bowl">Bowls - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/boxes/boxes-asian-antiques.php" title="Antique Asian Boxe">Boxes - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/bracelets/bracelets-asian-antiques.php" title="Antique Asian Bracelet">Bracelets - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/brush-pots/brush-pots-asian-antiques.php" title="Antique Asian Brush Pot">Brush Pots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/brush-water/brush-washer-asian-antiques.php" title="Antique Asian Brush Washer">Brush Washers - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/dolls/dolls-asian-antiques.php" title="Asian Antique Doll">Dolls - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/fans/fans-asian-antiques.php" title="Asian Antique Fan">Fans - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/furniture/furniture-asian-antiques.php" title="Asian Antique Furniture">Furniture - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/glasses-and-cups/glasses-and-cups-asian-antiques.php" title="Asian Antique Glass and Cup">Glasses and Cups - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/incense-burners/incense-burners-asian-antiques.php" title="Asian Antique Incense Burner">Incense Burners - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/ink-stones/ink-stones-asian-antiques.php" title="Asian Antique Ink Stone">Ink Stones - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/katana/katana-asian-antiques.php" title="Asian Antique Katana">Katana - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/kimonos-robes-and-textiles/kimonos-robes-and-textiles-asian -antiques.php" title="Asian Antique Kimono, Robe, and Textile">Kimonos, Robes and Textiles - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/masks/masks-asian-antiques.php" title="Asian Antique Mask">Masks - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/necklaces-and-pendants/necklaces-and-pendants-asian-antique s.php" title="Asian Antique Necklace and Pendant">Necklaces and Pendants - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/netsuke/netsuke-asian-antiques.php" title="Asian Antique Netsuke">Netsuke - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/paintings-scrolls-and-prints/paintings-scrolls-and-prints-a sian-antiques.php" title="Asian Antique Painting, Scroll and Print">Paintings, Scrolls and Prints - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/plates/plates-asian-antiques.php" title="Asian Antique Plate">Plates - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/pots/pots-asian-antiques.php" title="Asian Antique Pot">Pots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/rings/rings-asian-antiques.php" title="Asian Antique Ring">Rings - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/seals/seals-asian-antiques.php" title="Asian Antique Seal">Seals - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/snuff-bottles/snuff-bottles-asian-antiques.php" title="Asian Antique Snuff Bottle">Snuff Bottles - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/statues/statues-asian-antiques.php" title="Asian Antique Statue">Statues - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/swords/swords-asian-antiques.php" title="Asian Antique Sword">Swords - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/tea-caddies/tea-caddies-asian-antiques.php" title="Asian Antique Tea Caddie">Tea Caddies - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/teapots/teapots-asian-antiques.php" title="Asian Antique Teapot">Teapots - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/tubas/tubas-asian-antiques.php" title="Asian Antique Tuba">Tubas - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/vases/vases-asian-antiques.php" title="Asian Antique Vase">Vases - Asian Antiques</a></p>
              <p><a href="antiques/asian-antiques/other-asian-antiques/other-asian-antiques.php" title="Other Asian Antiques">Other Asian Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Books and Manuscripts Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/books-and-manuscripts-antiques/americana/americana-books-and-manuscripts-a ntiques.php" title="Americana Book">Americana - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/art-and-photography/art-and-photography-boo ks-and-manuscripts-antiques.php" title="Art Book and Photography Book">Art and Photography - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/biography-and-autobiography/biography-and-a utobiography-books-and-manuscripts-antiques.php" title="Biography and Autobiography Book">Biography and Autobiography - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/children/children-books-and-manuscripts-ant iques.php" title="Children Book">Children's - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/cooking/cooking-books-and-manuscripts-antiq ues.php" title="Cook Book">Cooking - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/exploration-and-travel/exploration-and-trav el-books-and-manuscripts-antiques.php" title="Exploration Book and Travel Book">Exploration and Travel - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/fraternal-social-organizations/fraternal-so cial-organizations-books-and-manuscripts-antiques.php" title="Fraternal and Social Organization Book">Fraternal, Social Organizations - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/history/history-books-and-manuscripts-antiq ues.php" title="History Book">History - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/home-and-garden/home-and-garden-books-and-m anuscripts-antiques.php" title="Home Book and Garden Book">Home and Garden - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/law-and-government/law-and-government-books -and-manuscripts-antiques.php" title="Law Book and Government Book">Law and Government - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/literature-and-fiction/literature-and-ficti on-books-and-manuscripts-antiques.php" title="Literature Book and Fiction Book">Literature and Fiction - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/military-and-war/military-and-war-books-and -manuscripts-antiques.php" title="Military Book and War Book">Military and War - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/outdoor-and-nature/outdoor-and-nature-books -and-manuscripts-antiques.php" title="Outdoor Book and Nature Book">Outdoor and Nature - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/performing-arts/performing-arts-books-and-m anuscripts-antiques.php" title="Performing Art Book">Performing Arts - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/pulps/pulps-books-and-manuscripts-antiques. php" title="Pulp Book">Pulps - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/reference/reference-books-and-manuscripts-a ntiques.php" title="Reference Book">Reference - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/religion-and-spirituality/religion-and-spir ituality-books-and-manuscripts-antiques.php" title="Religious Book and Spirituality Book">Religion and Spirituality - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/science-and-medicine/science-and-medicine-b ooks-and-manuscripts-antiques.php" title="Science Book and Medicine Book">Science and Medicine - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/sports/sports-books-and-manuscripts-antique s.php" title="Sport Book">Sports - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/vintage-paperbacks/vintage-paperbacks-books -and-manuscripts-antiques.php" title="Vintage Paperback">Vintage Paperbacks - Books and Manuscripts Antiques</a></p>
              <p><a href="antiques/books-and-manuscripts-antiques/other-books-and-manuscripts-antiques/other- books-and-manuscripts-antiques.php" title="Other Book and Manuscrpit Antiques">Other - Books and Manuscripts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Carvings Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/carvings-antiques/african-carvings/african-carvings-antiques.php" title="African Carving">African - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/anri-wood-carvings/anri-wood-carvings-antiques.php" title="Ari Wood Carving">Anri Wood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/chinese-carvings/chinese-carvings-antiques.php" title="Chinese Carving">Chinese - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/intuit-carvings/intuit-carvings-antiques.php" title="Intuit Carving">Intuit - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/ironwood-carvings/ironwood-carvings-antiques.php" title="Ironwood Carving">Ironwood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/jade-carvings/jade-carvings-antiques.php" title="Jade Carving">Jade - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/stone-carvings/stone-carvings-antiques.php" title="Stone Carving">Stone -  Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/wood-carvings/wood-carvings-antiques.php" title="Wood Carving">Wood - Antique Carvings</a></p>
              <p><a href="antiques/carvings-antiques/other-antique-carvings/other-carvings-antiques.php" title="Other Antique Carving">Other - Antique Carvings</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Ceramic and Porcelain Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/ceramic-and-porcelain-antiques/amphora/amphora-ceramic-and-porcelain-antiq ues.php" title="Amphora">Amphora - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/bavaria/bavaria-ceramic-and-porcelain-antiq ues.php" title="Bavaria">Bavaria - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/bellek-bellek-american-or-bellek-irish/bell ek-bellek-american-or-bellek-irish-ceramic-and-porcelain-antiques.php" title="Belleek">Belleek, Belleek American or Belleek Irish - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/capodimonte/capodimonte-ceramic-and-porcela in-antiques.php" title="Capodimonte">Capodimonte - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/celadon/celadon-ceramic-and-porcelain-antiq ues.php" title="Celadon">Celadon - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/celadon-northern-or-southern/celadon-northe rn-or-southern-ceramic-and-porcelain-antiques.php" title="Northern Celadon or Southern Celadon">Celadon, Northern or Southern - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/chintz-grimwades-royal-winton-lefton-shelll y/chintz-grimwades-royal-winton-lefton-shelly-ceramic-and-porcelain-antiques.php" title="Chintz, Grimwades (Royal Winton), Lefton, Shelly">Chintz, Grimwades   (Royal Winton), Lefton, Shelly - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/cookie-jars-hall-hull-mccoy-redwing-shelly/ cookie-jars-hall-hull-mccoy-redwing-shelly.php" title="Antique Cookie Jars">Cookie Jars, Hall, Hull, McCoy,   Redwing, Shelly - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/copeland-spode/copeland-spode-ceramic-and-p orcelain-antiques.php" title="Copeland Spode">Copeland Spode - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/dedham-pottery/dedham-pottery-ceramic-and-p orcelain-antiques.php" title="Dedham Pottery">Dedham Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/delftware/delftware-ceramic-and-porcelain-a ntiques.php" title="Delftware">Delftware - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/dresden-meissen/dresden-meissen-ceramic-and -porcelain-antiques.php" title="Dresden Meissen">Dresden Meissen - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/famille-rose/famille-rose-ceramic-and-porce lain-antiques.php" title="Famille Rose">Famille   Rose - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/fiesta/fiesta-ceramic-and-porcelain-antique s.php" title="Fiesta">Fiesta - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/flow-blue/flow-blue-ceramic-and-porcelain-a ntiques.php" title="Flow Blue">Flow Blue - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/fulper/fulper-ceramic-and-porcelain-antique s.php" title="Fulper">Fulper - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/grueby-pottery/grueby-pottery-ceramic-and-p orcelain-antiques.php" title="Grueby Pottery">Grueby Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hall-pottery/hall-pottery-ceramic-and-porce lain-antiques.php" title="Hall Pottery">Hall Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/haviland-china/haviland-china-ceramic-and-p orcelain-antiques.php" title="Haviland Ching">Haviland China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hull-pottery/hull-pottery-ceramic-and-porce lain-antiques.php" title="Hull Pottery">Hull Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hummel-items-figurines-plates/hummel-items- figurines-plates-ceramic-and-porcelain-antiques.php" title="Hummel, Items, Figurines, Plates">Hummel, Items, Figurines, Plates - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/hummel-goebel/hummel-goebel-ceramic-and-por celain-antiques.php" title="Hummel Goebel">Hummel Goebel - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/kpm-figurines-plates-plaques/kpm-figurines- plates-plaques-ceramic-and-porcelain-antiques.php" title="KPM, figurines, plates, plaques - Ceramic and Porcelain Antiques">KPM, figurines, plates, plaques - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/lenox-china/lenox-china-ceramic-and-porcela in-antiques.php" title="Lenox China">Lenox China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/limoge-china/limoge-china-ceramic-and-porce lain-antiques.php" title="Limoge China">Limoge China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/lladro-porcelains/lladro-porcelains-ceramic -and-porcelain-antiques.php" title="Lladro Porcelain">Lladro Porcelains - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/majolica/majolica-ceramic-and-porcelain-ant iques.php" title="Majolica">Majolica - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/mccoy-pottery/mccoy-pottery-ceramic-and-por celain-antiques.php" title="McCoy Pottery">McCoy Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/minton-china/minton-china-ceramic-and-porce lain-antiques.php" title="Milton China">Minton China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/newcomb-college-pottery/newcomb-college-pot tery-ceramic-and-porcelain-antiques.php" title="Newcomb College Pottery">Newcomb College Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/niloak-pottery/niloak-pottery-ceramic-and-p orcelain-antiques.php" title="Niloak Pottery">Niloak Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/nippon-china/nippon-china-ceramic-and-porce lain-antiques.php" title="Nippon China">Nippon China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/noritake-china/noritake-china-ceramic-and-p orcelain-antiques.php" title="Noritake China">Noritake China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/old-sleepy-eye/old-sleepy-eye-ceramic-and-p orcelain-antiques.php" title="Old Sleepy Eye">Old Sleepy Eye - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/onion-meissen/onion-meissen-ceramic-and-por celain-antiques.php" title="Onion Meissen">Onion   Meissen -  Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/oriental/oriental-ceramic-and-porcelain-ant iques.php" title="Oriental Ceramic and Porcelain">Oriental - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/parian-ware/parian-ware-ceramic-and-porcela in-antiques.php" title="Parian Ware">Parian Ware -  Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/piano-babies/piano-babies-ceramic-and-porce lain-antiques.php" title="Piano Babies">Piano Babies Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/pickard-china/pickard-china-ceramic-and-por celain-antiques.php" title="Pickard China">Pickard China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/quimper/quimper-ceramic-and-porcelain-antiq ues.php" title="Quimper Ceramics">Quimper Ceramics - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/red-wing-pottery/red-wing-pottery-ceramic-a nd-porcelain-antiques.php" title="Red Wing Pottery">Red Wing Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rockingham-rockingham-brown-glazed-wares/ro ckingham-rockingham-brown-glazed-wares-ceramic-and-porcelain-antiques.php" title="Rockingham and Rockingham Brown Glazed Wares">Rockingham, Rockingham Brown Glazed Wares - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rookwood-pottery/rookwood-pottery-ceramic-a nd-porcelain-antiques.php" title="Rookwood Pottery">Rookwood Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rose-canton-rose-mandarin-rose-medallion/ro se-canton-rose-mandarin-rose-medallion-ceramic-and-porcelain-antiques.php" title="Rose Canton, Rose Mandarin and Rose Medallion">Rose Canton, Rose Mandarin, Rose Medallion - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/rosenthal-porcelain/rosenthal-porcelain-cer amic-and-porcelain-antiques.php" title="Rosenthal">Rosenthal Porcelain - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/roseville-pottery/roseville-pottery-ceramic -and-porcelain-antiques.php" title="Roseville Pottery">Roseville Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-bayreuth/royal-bayreuth-ceramic-and-p orcelain-antiques.php" title="Royal Bayreuth">Royal Bayreuth - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-bohn/royal-bohn-ceramic-and-porcelain -antiques.php" title="Royal Bonn">Royal Bonn - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-coppenhagen/royal-coppenhagen-ceramic -and-porcelain-antiques.php" title="Royal Coppenhagen">Royal   Coppenhagen - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-crown-derby/royal-crown-derby-ceramic -and-porcelain-antiques.php" title="Royal Crown Derby">Royal Crown Derby - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-doulton/royal-doulton-ceramic-and-por celain-antiques.php" title="Royal Doulton">Royal Doulton - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/royal-worchester/royal-worchester-ceramic-a nd-porcelain-antiques.php" title="Roayl Worchester">Royal   Worcester - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/satsuma/satsuma-ceramic-and-porcelain-antiq ues.php" title="Satsuma">Satsuma - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/sevres/sevres-ceramic-and-porcelain-antique s.php" title="Sevres">Sevres - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/shawnee-pottery/shawnee-pottery-ceramic-and -porcelain-antiques.php" title="Shawnee Pottery">Shawnee Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/shelley/shelley-ceramic-and-porcelain-antiq ues.php" title="Shelley">Shelley - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/staffordshire/staffordshire-ceramic-and-por celain-antiques.php" title="Straffordshire">Staffordshire - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/stangl-pottery-birds/stangl-pottery-birds-c eramic-and-porcelain-antiques.php" title="Stangl Pottery">Stangl Pottery Birds - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/tiles/tiles-ceramic-and-porcelain-antiques. php" title="Ceramic and Porcelain Tile">Tiles - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/toby-jugs/toby-jugs-ceramic-and-porcelain-a ntiques.php" title="Toby Jug">Toby Jugs - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/van-briggle/van-briggle-pottery-ceramic-and -porcelain-antiques.php" title="Van Briggle Pottery">Van Briggle Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/wedgewood/wedgewood-ceramic-and-porcelain-a ntiques.php" title="Wedgwood Pottery">Wedgwood - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/weller-pottery/weller-pottery-ceramic-and-p orcelain-antiques.php" title="Weller Pottery">Weller Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/willow-pattern-china/willow-pattern-ceramic -and-porcelain-antiques.php" title="Willow Pattern China">Willow Pattern China - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/zanesville-pottery/zanesville-pottery-ceram ic-and-porcelain-antiques.php" title="Zanesville Pottery">Zanesville Pottery - Ceramic and Porcelain Antiques</a></p>
              <p><a href="antiques/ceramic-and-porcelain-antiques/other-ceramic-and-porcelain-antiques/other- ceramic-and-porcelain-antiques.php" title="Other Antique Ceramic and Porcelan">Other - Ceramic and Porcelain Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Clocks Antiques</div>
            <div class="AccordionPanelContent">
              <p> <a href="antiques/clocks-antiques/antique-clocks/pre-1930-clocks-antiques.php" title="Antique Clock"> Antique Clocks - Pre 1930</a></p>
              <p><a href="antiques/clocks-antiques/parts-and-tools-for-clocks-antiques/parts-and-tools-for-cl ocks-antiques.php" title="Antique Clock Parts and Tools">Parts and Tools for Antique Clocks</a></p>
              <p><a href="antiques/clocks-antiques/price-guides-and-publications-for-clocks-antiques/price-gu ides-and-publications-for-clocks-antiques.php" title="Price Guides and Publications for Antique Clocks">Price Guides and Publications for Antique Clocks</a></p>
              <p><a href="antiques/clocks-antiques/other-clocks-antiques/other-clocks-antiques.php" title="Other Antique Clock">Other - Antique Clocks</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Comics Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/comics-antiques/antique-comics/comics-pre-1930-antiques.php" title="Antique Comic">Antique Comics (Pre 1930)</a></p>
              <p><a href="antiques/comics-antiques/other-comic-pre-1930-antiques/other-comic-pre-1930-antique s.php" title="Other Antique Comic">Other - Antique Comics (Pre 1930) </a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Decorative Arts Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/decorative-arts-antiques/bottles/bottles-decorative-arts-antiques.php" title="Antique Bottle">Bottles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/bowls/bowls-decorative-arts-antiques.php" title="Antique Bowl">Bowls - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/boxes/boxes-decorative-arts-antiques.php" title="Antique Box">Boxes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/butter-pats/butter-pats-decorative-arts-antiques. php" title="Butter Pat">Butter Pats - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/candle-holders/candle-holders-decorative-arts-ant iques.php" title="Candle Holder">Candle Holders - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/candle-sticks/candle-sticks-decorative-arts-antiq ues.php" title="Candle Stick">Candle Sticks - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/clocks/clocks-decorative-arts-antiques.php" title="Antique Clock">Clocks - Decorative Arts Antiques </a></p>
              <p><a href="antiques/decorative-arts-antiques/compotes/compotes-decorative-arts-antiques.php" title="Compotes">Compotes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/creamers-and-sugar-bowls/creamers-and-sugar-bowls -decorative-arts-antiques.php" title="Creamers and Sugar Bowls">Creamers and Sugar Bowls - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/crocks/crocks-decorative-arts-antiques.php" title="Crocks">Crocks - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/cups-and-saucers/cups-and-saucers-decorative-arts -antiques.php" title="Cup and Saucer">Cups and Saucers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/decanters/decanters-decorative-arts-antiques.php" title="Decanter">Decanters - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/dishes/dishes-decorative-arts-antiques.php" title="Antique Dish">Dishes - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/figurines-and-statues/figurines-and-statues-decor ative-arts-antiques.php" title="Figurines and Statues">Figurines and Statues - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/jars/jars-decorative-arts-antiques.php" title="Antique Jar">Jars - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/lamps/lamps-decorative-arts-antiques.php" title="Antique Lamp">Lamps - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/mirrors/mirrors-decorative-arts-antiques.php" title="Mirror">Mirrors - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/perfume-bottles/perfume-bottles-decorative-arts-a ntiques.php" title="Perfume Bottle">Perfume Bottles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/picture-frames/picture-frames-decorative-arts-ant iques.php" title="Picture Frame">Picture Frames - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/pitchers/pitchers-bottles-decorative-arts-antique s.php" title="Pitcher">Pitchers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/planters/planters-decorative-arts-antiques.php" title="Planter">Planters - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/plates/plates-decorative-arts-antiques.php" title="Antique Plate">Plates - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/platters-and-trays/platters-and-trays-decorative- arts-antiques.php" title="Platter and Tray">Platters and Trays - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/salt-and-pepper-shakers/salt-and-pepper-shakers-d ecorative-arts-antiques.php" title="Salt and Pepper Shaker">Salt and Pepper Shakers - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/stained-glass-windows/stained-glass-windows-decor ative-arts-antiques.php" title="Stained Glass Window">Stained Glass Windows - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/stemware/stemware-decorative-arts-antiques.php" title="Antique Stemware">Stemware - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tea-caddies/tea-caddies-decorative-arts-antiques. php" title="Antique Tea Caddie">Tea Caddies - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/teapots-and-tea-sets/teapots-and-tea-sets-decorat ive-arts-antiques.php" title="Teapot and Tea Set">Teapots and Tea Sets - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tiles/tiles-decorative-arts-antiques.php" title="Antique Tile">Tiles - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/tureens/tureens-decorative-arts-antiques.php" title="Tureen">Tureens - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/urns/urns-decorative-arts-antiques.php" title="Urn">Urns - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/vases/vases-decorative-arts-antiques.php" title="Vase">Vases - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/wooden-ware/wooden-ware-decorative-arts-antiques. php" title="Antique Wooden Ware">Wooden Ware - Decorative Arts Antiques</a></p>
              <p><a href="antiques/decorative-arts-antiques/other-decorative-arts-antiques/other-decorative-a rts-antiques.php" title="Other Decorative Arts Antiques">Other - Decorative Arts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Dolls and Doll Houses Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/dolls-and-doll-houses-antiques/china-head-dolls/china-head-dolls-antiques. php" title="China Head Doll">China Head Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/cloth-lenci-dolls/cloth-lenci-dolls-antique s.php" title="Cloth Lence Doll">Cloth Lenci Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/early-dolls/early-dolls-dolls-antiques.php" title="Early Doll">Early Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/gemran-bisque-dolls/german-bisque-dolls-ant iques.html" title="German Bisque Doll">German Bisque Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/german-character-dolls/german-character-dol ls-antiques.php" title="German Character Doll">German Character  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/kewpies-dolls/kewpies-dolls-antiques.php" title="Hard Plastic Doll">Hard Plastic  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/kewpies-dolls/kewpies-dolls-antiques.php" title="Kewpie Doll">Kewpies  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/madame-alexander-dolls/madame-alexander-dol ls-antiques.php" title="Madame Alexander Doll">Madame Alexander  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/papier-machie-dolls/papier-machie-dolls-ant iques.php" title="Papier Mache Doll">Papier Mache  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/r-john-wright-dolls/r-john-wright-dolls-ant iques.php" title="R. John Wright Doll">R. John Wright  Dolls - Antiques</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/shirley-temple-composition-dolls/shirley-te mple-composition-dolls-antiques.php" title="Shirley Temple Composition Doll">Shirley Temple Composition  Dolls - Antique</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/other-dolls-antiques/other-dolls-antiques.p hp" title="Other Antique Dolls">Other Antique Dolls</a></p>
              <p><a href="antiques/dolls-and-doll-houses-antiques/doll-houses/doll-house-dolls-antiques.php" title="Doll House and Doll Houses">Doll House Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Ethnographic Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/ethnographic-antiques/african-ethnographic-antiques/african-ethnographic-a ntiques.php" title="African Antique">African - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/latin-american-ethnographic-antiques/latin-american- ethnographic-antiques.php" title="Latin American Antique">Latin American - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/native-american-ethnographic-antiques/native-america n-ethnographic-antiques.php" title="Native American Antique">Native American - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/pacific-islands-andoceania-ethnographic-antiques/pac ific-islands-andoceania-ethnographic-antiques.php" title="Pacific Island Antique">Pacific Islands and Oceania - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/price-guides-and-publications-ethnographic-antiques/ price-guides-and-publications-ethnographic-antiques.php" title="Price Guides and Publications - Ethnographic Antiques">Price Guides and Publications - Ethnographic Antiques</a></p>
              <p><a href="antiques/ethnographic-antiques/other-ethnographic-antiques/other-ethnographic-antiq ues.php" title="Other - Ethnographic Antiques">Other - Ethnographic Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Furniture Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/furniture-antiques/danish-furniture/danish-furniture-antiques.php" title="Danish Furniture">Danish Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/edwardian-furniture/edwardian-furniture-antiques.php" title="Edwardian Furniture">Edwardian Furniture - Antiques </a></p>
              <p><a href="antiques/furniture-antiques/french-furniture/french-furniture-antiques.php" title="French Furniture">French  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/mid-century-modern-furniture/mid-century-modern-furnitu re-antiques.php" title="Mid Century Modern Furniture">Mid Century Modern Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/mission-furniture/mission-furniture-antiques.php" title="Mission Furniture">Mission  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/george-nelson-furniture/george-nelson-furniture-antique s.php" title="George Nelson Furniture">George Nelson Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/victorian-furniture/victorian-furniture-antiques.php">V ictorian  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/heywood-wakefield-furniture/heywood-wakefield-furniture -antiques.php" title="Heywood Wakefield Furniture">Heywood Wakefield  Furniture - Antiques</a></p>
              <p><a href="antiques/furniture-antiques/other-antique-furniture/other-furniture-antiques.php" title="Other Antique Furniture">Other - Antique Furniture </a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Gasoline Pumps Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/gasoline-pumps-antiques/gasoline-pumps/gasoline-pumps-antiques.php" title="Antique Gas Pump">Gasoline Pumps Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/gasoline-pump-parts/gasoline-pump-parts-antiques.p hp" title="Antique Gas Pump Parts">Gasoline Pump Parts Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/reproduction-gasoline-pumps/reproduction-gasoline- pumps-antiques.php" title="Reproduction Gas Pump">Reproduction Gasoline Pumps Antiques</a></p>
              <p><a href="antiques/gasoline-pumps-antiques/reproduction-gasoline-pump-parts/reproduction-gaso line-pump-parts-antiques.php" title="Reproduction Gas Pump Parts">Reproduction Gasoline Pump Parts Antiques</a></p>
            </div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab">Glass Antiques</div>
            <div class="AccordionPanelContent">
              <p><a href="antiques/glass-antiques/agata-glass/antique-agata-glass.php" title="Agata Glass">Agata Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/amberina-glass/antique-amberina-glass.php" title="Amberina Glass">Amberina Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/baccarat-glass/antique-baccarat-glass.php" title="Baccarat Glass">Baccarat Glass -  Antique</a></p>
              <p><a href="antiques/glass-antiques/bohemian-glass/antique-bohemian-glass.php" title="Bohemian Glass">Bohemian Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/bristol-glass/bristol-glass-antiques.php" title="Bristol Glass">Bristol Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cambridge-glass/antique-cambridge-glass.php" title="Cambridge Glass">Cambridge Glass -  Antique</a></p>
              <p><a href="antiques/glass-antiques/cameo-glass/antique-cameo-glass.php">Cameo Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cambridge-glass/antique-cambridge-glass.php" title="Carnival Glass">Carnival  Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/cranberry-glass/cranberry-glass-antiques.php" title="Cranberry Glass">Cranberry Glass Antique</a></p>
              <p><a href="antiques/glass-antiques/cut-glass/cut-glass-antiques.php" title="Cut Glass">Cut Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/depression-glass/depression-glass-antiques.php" title="Depression Glass">Depression Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/duncan-and-miller-glass/duncan-and-miller-glass-antiques.ph p" title="Duncan and Miller Glass">Duncan and Miller Glass - Antique</a></p>
              <p><a href="antiques/glass-antiques/eapg-early-ame

    Can you please post a example of what your are talking about?  Here is another site I am using Spry on and this site works ..  http://www.sub-zero-refrigeration.com
    I think this is what you are refering too.  Please let me know.
    """"<script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-1.9.1.min.js" type"text/javascript"></script>
    <script type="text/javascript">
          window.AgMode = "publish";
          cellRolloverColor="#a1a1a1";                   
          cellColor="#c0c0c0";
          </script>
    </script>""""""
    <!DOCTYPE HTML>
    <html lang=en><!-- InstanceBegin template="/Templates/cityweather.dwt" codeOutsideHTMLIsLocked="false" -->
        <head>
        <meta charset="utf-8">
    <!-- InstanceBeginEditable name="head" -->
    <title>Best AC / HVAC / Furnace Repair - Orland Park, Oak Lawn, Tinley Park, Frankfort, Oak Forest, IL </title>
    <meta name="description" content="Sub Zero Refrigeration Heating and Air Conditioning is a furnace and AC repair contractor in Orland Park, Oak Lawn, Tinley Park, Oak Forest and Frankfort Il.">
    <meta name="keywords" content="Repair, Heating, Air Conditioning, Refrigeration, Furnace, AC, Ice Maker, Ice Machine, Orland Park, Oak Lawn, Tinley Park, Oak Forest, Frankfort, Insatllation,Sales, Maintenance">
    <style type="text/css">
    body,td,th {
        font-size: 100%;
    </style>
    <style type="text/css">
    body {
        margin-left: 5px;
        margin-right: 5px;
    </style>
    <meta name="msvalidate.01" content="49FF257D7BCD932B5FFB37AA0138ED93" />
    <meta name="msvalidate.01" content="D1F605709ED62957017E2ED7F48A35AF" />
    <!-- InstanceEndEditable -->
        <meta name="author" content="Ted Wagner" />
        <meta name="google-site-verification" content="-iGiLKN5W90OD90NqAgOAjezTufISVwxh5QS9FFlwy0" />
        <link rel="icon" type="image/vnd.microsoft.icon" href="/favicon.ico" />
        <link href="twoColFixLtHdr.css" rel="stylesheet" type="text/css">
        <link href="/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
        <meta name="DC.title" content="Sub Zero Refrigeration Heating and Air Conditioning" />
        <meta name="geo.placename" content="3662 147th St, Midlothian, IL 60445, USA" />
        <meta name="geo.position" content="41.625766;-87.710394" />
        <meta name="geo.region" content="US-IL" />
        <meta name="ICBM" content="41.625766, -87.710394" />
        <meta name="rating" content="general" />
    <script src="/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-1.9.1.min.js" type"text/javascript"></script>
    <script type="text/javascript">
          window.AgMode = "publish";
          cellRolloverColor="#a1a1a1";                   
          cellColor="#c0c0c0";
          </script>
    </script>
    <!--[if lt IE 7.]> <script defer type="text/javascript" src="../resources/js/pngfix.js"></script> <![endif]-->
    <!--[if gt IE 6]> <link rel="stylesheet" href="../resources/css/ie7.css"></link> <![endif]-->
    <!--[if lt IE 7.]> <link rel="stylesheet" href="../resources/css/ie6.css"></link> <![endif]-->
    <script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-23232524-3']);
      _gaq.push(['_trackPageview']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    </script></head>
    <body>
    <div class="container">
      <div class="header"><img src="/Assets/Images/Subby.gif" width="125" height="190" alt="Sub Zero Refrigeration Heating and Air Conditioning Suburban Chicago Logo"><!-- end .header --><img src="/Assets/Images/HeaderOriginal.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning Repair Services Chicago Illinois." width="835" height="190" border="0" usemap="#Map2">
        <map name="Map2">
          <area shape="rect" coords="5,4,827,179" href="/index.html" alt="Sub Zero Refrigeration Heating and Air Conditioning Midlothian Illinois 708-385-2418">
        </map>
      </div>
      <div class="header">
        <ul id="MenuBar2" class="MenuBarHorizontal">
            <li><a href="/airconditioning.html" class="MenuBarItemSubmenu">Cooling</a>
              <ul>
                <li><a href="/residentialairconditioning.html" class="MenuBarItemSubmenu">Residential Air Conditioning</a>
                  <ul>
                    <li><a href="/installac.html">Installation</a></li>
                    <li><a href="/repairairconditioning.html">Repair</a></li>
                    <li><a href="/salesairconditioning.html">Sales</a></li>
                    <li><a href="/maintainac.html">Maintenance</a></li>
                    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
    <li><a href="/commercial-rooftop-products.html" class="MenuBarItemSubmenu">Commercial Air Conditioning</a>
                <ul>
        <li><a href="/commercial-rooftop-installation.html">Installation</a></li>
        <li><a href="/commercial-rooftop-repair.html">Repair</a></li>
        <li><a href="/commercial-rooftop-sales.html">Sales</a></li>
        <li><a href="/maintaincommercialrooftop.html">Maintenance</a></li>
      </ul>
    </li>
    </ul>
          </li>
            <li><a href="/heating.html" class="MenuBarItemSubmenu">Heating</a>
              <ul>
                <li><a href="/residentialheating.html" title="Residential Furnace Products" class="MenuBarItemSubmenu">Residential Heating</a>
                  <ul>
    <li><a href="/furnace-installation.html">Installation</a></li>
    <li><a href="/repairfurnace.html">Repair</a></li>
    <li><a href="/salesfurnace.html">Sales</a></li>
    <li><a href="/maintainfurnace.html">Maintenance</a></li>
    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
                <li><a href="/heat-pump-products.html" class="MenuBarItemSubmenu">Residential Heat Pump</a>
                  <ul>
                    <li><a href="/heat-pump-installation.html">Installation</a></li>
                    <li><a href="/repairheatpump.html">Repair</a></li>
                    <li><a href="/salesheatpump.html">Sales</a></li>
                    <li><a href="/maintainheatpump.html">Maintenance</a></li>
                    <li><a href="/financing.html">Financing</a></li>
                  </ul>
                </li>
                <li><a href="/commercial-rooftop-products.html" class="MenuBarItemSubmenu">Commercial Heating</a>
                  <ul>
                    <li><a href="/commercial-rooftop-installation.html">Installation</a></li>
                    <li><a href="/commercial-rooftop-repair.html">Repair</a></li>
                    <li><a href="/commercial-rooftop-sales.html">Sales</a></li>
                    <li><a href="/commercial-rooftop-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/refrigeration.html" class="MenuBarItemSubmenu">Refrigeration</a>
              <ul>
                <li><a href="/walk-in-cooler-products.html" class="MenuBarItemSubmenu">Walk In Cooler</a>
                  <ul>
                    <li><a href="/walk-in-cooler-installation.html">Installation</a></li>
                    <li><a href="/walk-in-cooler-repair.html">Repair </a></li>
                    <li><a href="/walk-in-cooler-sales.html">Sales</a></li>
                    <li><a href="/walk-in-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/walk-in-freezer-products.html" class="MenuBarItemSubmenu">Walk In Freezer</a>
                  <ul>
                    <li><a href="/walk-in-freezer-installation.html">Installation</a></li>
                    <li><a href="/walk-in-freezer-repair.html">Repair</a></li>
                    <li><a href="/walk-in-freezer-sales.html">Sales</a></li>
                    <li><a href="/walk-in-freezer-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/reach-in-cooler-products.html" class="MenuBarItemSubmenu">Reach In Cooler </a>
                  <ul>
                    <li><a href="/reach-in-cooler-installation.html">Installation</a></li>
                    <li><a href="/reach-in-cooler-repair.html">Repair</a></li>
                    <li><a href="/reach-in-cooler-sales.html">Sales</a></li>
                    <li><a href="/reach-in-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/reach-in-freezer-products.html" class="MenuBarItemSubmenu">Reach In Freezer</a>
                  <ul>
                    <li><a href="/reach-in-freezer-installation.html">Installation</a></li>
                    <li><a href="/reach-in-freezer-repair.html">Repair</a></li>
    <li><a href="/reach-in-freezer-sales.html">Sales</a></li>
    <li><a href="/reach-in-freezer-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/floral-cooler-products.html" class="MenuBarItemSubmenu">Floral Cooler</a>
                  <ul>
                    <li><a href="/floral-cooler-installation.html">Installation</a></li>
                    <li><a href="/floral-cooler-repair.html">Repair</a></li>
                    <li><a href="/floral-cooler-sales.html">Sales</a></li>
                    <li><a href="/floral-cooler-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/icemachine.html" class="MenuBarItemSubmenu">Ice Maker</a>
              <ul>
                <li><a href="/hoshizakiicemachines.html" class="MenuBarItemSubmenu">Hoshizaki Ice Machine</a>
                  <ul>
                    <li><a href="/hoshizaki-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/hoshizaki-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/hoshizaki-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/hoshizaki-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/manitowocicemachine.html" class="MenuBarItemSubmenu">Manitowoc Ice Machine</a>
                  <ul>
                    <li><a href="/manitowoc-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/manitowoc-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/manitowoc-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/manitowoc-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
                <li><a href="/scotsmanicemachines.html" class="MenuBarItemSubmenu">Scotsman Ice Machine</a>
                  <ul>
                    <li><a href="/scotsman-ice-machine-installation.html">Installation</a></li>
                    <li><a href="/scotsman-ice-machine-repair.html">Repair</a></li>
                    <li><a href="/scotsman-ice-machine-sales.html">Sales</a></li>
                    <li><a href="/scotsman-ice-machine-maintenance.html">Maintenance</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/iaq.html" class="MenuBarItemSubmenu"> Air Quality</a>
              <ul>
                <li><a href="/iaqeac.html">Electronic Air Cleaner</a></li>
                <li><a href="/iaqaprilairehumidifier.html">Humidifier</a></li>
                <li><a href="/iaquvlights.html">UV Germicidal Lights</a></li>
              </ul>
          </li>
            <li><a href="/jobphotos.html" class="MenuBarItemSubmenu">Job Photos</a>
              <ul>
    <li><a href="/jobphotoscommercialrooftop.html">Commercial Rooftop Heating and Air Conditioning Photos</a></li>
    <li><a href="/jobphotoscommercialrefrigeration.html">Commercial Refrigeration Photos</a></li>
    <li><a href="/jobphotoscommercialicemachine.html">Commercial Ice Machine Photos</a></li>
    <li><a href="/jobphotosairconditioning.html">Residential Air Conditioning Photos</a></li>
    <li><a href="/jobphotosfurnace.html">Residential Heating Photos</a></li>
    <li><a href="/jobphotosnaturalgasairconditioning.html">Natural Gas Air Conditioning Photos</a></li>
    <li><a href="/jobphotosmitsubishimrslim.html">Mitsubishi Mr Slim Ductless Heating and Ductless Air Conditioner Job Photos</a></li>
    <li><a href="#" class="MenuBarItemSubmenu">Boiler Photos</a>
                <ul>
                    <li><a href="/jobphotoscommercialboiler.html">Commercial Boiler Photos</a></li>
                    <li><a href="/jobphotosresidentialboiler.html">Residential Boiler Photos</a></li>
                  </ul>
                </li>
                <li><a href="/jobphotosheatpump.html">Heat Pump Photos</a></li>
                <li><a href="/jobphotosindoorairquality.html">Indoor Air Quality Photos</a></li>
                <li><a href="/jobphotossheetmetalonsite.html">Sheet Metal Made On-Site Job Photos</a></li>
                <li><a href="/jobphotoscranelift.html">Crane Lift Job Photos</a></li>
                <li><a href="/otherphotos.html">Other Miscellaneous Sub Zero Refrigeration Photos</a></li>
                <li><a href="/Assets/Videos/videos.html">Sub Zero Refrigeration Heating and Air Conditioning Videos</a></li>
              </ul>
            </li>
            <li><a href="/savings.html" class="MenuBarItemSubmenu">Savings</a>
              <ul>
                <li><a href="/monthlyspecials.html">Monthly Specials</a></li>
                <li><a href="/rebate.html">Manufacturers Rebates</a></li>
                <li><a href="/furnacerebates.html" class="MenuBarItemSubmenu">Utility Company Rebates</a>
                  <ul>
                    <li><a href="/comed.html">Com Ed</a></li>
                    <li><a href="/nicor.html">Nicor</a></li>
                  </ul>
                </li>
                <li><a href="/websitecoupons.html">Website Coupons</a></li>
              </ul>
            </li>
            <li><a href="/aboutus.html" class="MenuBarItemSubmenu">About Us</a>
              <ul>
                <li><a href="/chicago-service-area.html">Our Service Area</a></li>
                <li><a href="/ourmissionstatement.html">Our Mission Statement</a></li>
                <li><a href="/ourfamily.html">Our Family</a></li>
                <li><a href="/employees.html" class="MenuBarItemSubmenu">Our Staff</a>
                  <ul>
                    <li><a href="/budwagner.html">Bud Wagner</a></li>
                    <li><a href="/timwagner.html">Tim Wagner</a></li>
                    <li><a href="/daveallen.html">Dave Allen</a></li>
                    <li><a href="/larryskarr.html">Larry Skarr</a></li>
                    <li><a href="/terryburke.html">Terry Burke</a></li>
                    <li><a href="/nikooplt.html">Niko Oplt</a></li>
                    <li><a href="/ginaames.html">Gina Ames</a></li>
                    <li><a href="/laurakane.html">Laura Kane</a></li>
                  </ul>
                </li>
                <li><a href="/whychoosesubzero.html" class="MenuBarItemSubmenu">Why Choose Sub Zero Refrigeration?</a>
                  <ul>
                    <li><a href="/ourreviews.html">Our Reviews and Testimonials</a></li>
                    <li><a href="/ourcompetitionsreviews.html">Some of Our Competitions Reviews</a></li>
                    <li><a href="/americanstandardcustomercaredealer.html">American Standard Customer Care Dealer</a></li>
                    <li><a href="/customersurveys.html">American Standard Customer Satisfaction Surveys</a></li>
                    <li><a href="/betterbusinessbureau.html">The Better Business Bureau</a></li>
                  </ul>
                </li>
                <li><a href="/hvac-careers.html" class="MenuBarItemSubmenu">HVACR Careers</a>
                  <ul>
                    <li><a href="/hvac-technician-jobs.html">HVAC Technician</a></li>
                    <li><a href="/hvac-installer-jobs.html">HVAC/R Technician</a></li>
                    <li><a href="/hvacr-installer-jobs.html">HVAC/R Installer</a></li>
                    <li><a href="/hvac-sales-jobs.html">HVAC/R Sales</a></li>
                    <li><a href="/hvacr-jobs.html">Commercial Refrigeration Technician</a></li>
                  </ul>
                </li>
                <li><a href="/helpfullinks.html">Helpful Links</a></li>
                <li><a href="/favorite-sites.html">Our Favorite Websites</a></li>
                <li><a href="/easilyleaveusareview.html" class="MenuBarItemSubmenu">Easily Leave Us a Review</a>
                  <ul>
                    <li><a href="http://local.yahoo.com/info-84317831-sub-zero-refrigeration-midlothian" target="_blank">On &quot;Yahoo Local&quot;</a></li>                <li><a href="http://www.yelp.com/biz/sub-zero-refrigeration-midlothian-2" target="_blank">On &quot;Yelp&quot;</a></li>
                    <li><a href="http://www.merchantcircle.com/business/Sub.Zero.Refrigeration.708-385-2418" target="_blank">On &quot;Merchant Circle&quot;</a></li>
                    <li><a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new">On &quot;Google Places&quot;</a></li>
                    <li><a href="http://www.bing.com/local/details.aspx?lid=YN270x5360008" target="_blank">On &quot;Bing&quot;</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="/contactus.html">Contact </a></li>
        </ul></div>
      <table width="952" border="1" cellspacing="5">
        <tr>
          <th colspan="2" scope="col"><table width="942" border="1" align="center" cellspacing="5">
            <tr>
              <td><div align="center"><a href="/repairairconditioning.html"><img src="/Assets/Images/air-conditioner-repair.jpg" width="85" height="103" alt="Air Conditioning Repair Orland Park, Oak Lawn, Tinley Park, Oak Forest, Frankfort, IL"></a></div></td>
              <td><div align="center"><a href="/repairfurnace.html"><img src="/Assets/Images/furnace-repair.jpg" width="85" height="103" alt="Furnace Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/repairheatpump.html"><img src="/Assets/Images/heat-pump-repair.jpg" width="85" height="103" alt="Heat Pump Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/repairiaq.html"><img src="/Assets/Images/humidifier-repair.jpg" width="103" height="103" alt="Humidifier Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/estimate_1.png" width="158" height="85" alt="Schedule a Free Estimate Online for Sub Zero Refrigeration"></a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairairconditioning.html">Air Conditioning Repair</a></div></td>
              <td><div align="center"><a href="/repairfurnace.html">Heating   Repair</a></div></td>
              <td><div align="center"><a href="/repairheatpump.html">Heat Pump Repair</a></div></td>
              <td><div align="center"><a href="/repairiaq.html">Humidifier Repair</a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html">Schedule  Estimate</a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairrooftop.html"><img src="/Assets/Images/commercial-rooftop-air-conditioning-repair.jpg" width="141" height="103" alt="Commercial Air Conditioning Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/refrigeration-repair.html"><img src="/Assets/Images/refrigeration-repair.jpg" width="103" height="103" alt="Commercial Refrgeration Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/commercial-ice-maker-repair.html"><img src="/Assets/Images/ice-machine-repair.jpg" width="103" height="103" alt="Commercial Ice Maker Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/walk-in-cooler-repair.html"><img src="/Assets/Images/Beer_Cave_Booth.jpg" width="150" height="100" alt="Commercial Walk in Cooler Repair by Sub Zero Refrigeration"></a></div></td>
              <td><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/service_1.png" alt="Schedule a Service Call online for Sub Zero Refrigeration" width="105" height="90"></a></div></td>
            </tr>
            <tr>
              <td><div align="center"><a href="/repairrooftop.html">Commercial AC Repair</a></div></td>
              <td><div align="center"><a href="/refrigeration-repair.html">Refrigeration Repair</a></div></td>
              <td><div align="center"><a href="/commercial-ice-maker-repair.html">Ice Maker Repair</a></div></td>
              <td><div align="center"><a href="/walk-in-cooler-repair.html">Walk in Cooler Repair</a>
              </div></td>
              <td><div align="center"><a href="/sales.html">Schedule Service</a></div></td>
            </tr>
          </table></th>
        </tr>
      </table>
      <!-- InstanceBeginEditable name="Main Content" -->
      <table width="940" border="1" align="right" cellpadding="5" cellspacing="4">
        <tr>
          <td colspan="2" scope="col"><h1>Sub Zero Refrigeration Heating and Air Conditioning serving Orland Park, Oak Lawn, Tinley Park, Frankfort, Oak Forest, Midlothian and surrounding areas.</h1>
            <h3>Sub Zero Refrigeration Heating and Air Conditioning has been family owned and operated for over 40 years. We like to think of ourselves as one of the best heating and air conditioning contractors in Chicago.</h3>
          <h2><strong>Sub Zero Refrigeration <a href="repairfurnace.html">Heating Repair</a> and <a href="repairairconditioning.html">Air Conditioning Repair</a></strong></h2>
          <p>Sub Zero Refrigeration is a full service Refrigeration Heating and Air Conditioning or HVAC repair company providing quality workmanship and superb customer service.  Sub Zero offers you the best in heating repair, air conditioning repair, refrigeration and HVAC services to include: installation, repair, sales and maintenance of all major refrigeration, AC and heating equipment and indoor air quality products. We are a local Chicago heating and air conditioning, commercial refrigeration, service and repair company large enough to get the job   done and small enough for you to know we care about our commercial and residential customers. Our central location of <a href="../midlothian.html">Midlothian</a> Illinois allows us to provide fast reliable repair service to all of the <a href="ourservicearea.html">Chicago  Suburban cities</a> and towns such as <a href="../orlandpark.html">Orland Park</a>, <a href="../oaklawn.html">Oak Lawn</a>, <a href="../tinleypark.html">Tinley Park</a>, <a href="frankfort.html">Frankfort IL</a>, <a href="../oakforest.html">Oak Forest</a>, <a href="../newlenox.html">New Lenox</a> and <a href="ourservicearea.html">surrounding communities</a>.</p></td>
        </tr>
        <tr>
          <td colspan="2" scope="col"> </td>
        </tr>
        <tr>
          <td width="649" scope="col"><h2><strong><a href="repairairconditioning.html">Air Conditioning Repair Service</a></strong></h2>      
             <p>Sub Zero Refrigeration Heating and Air Conditioning is a <a href="repairairconditioning.html">full service air conditioning repair</a> company providing <a href="repairrooftop.html">commercial</a> and <a href="repairairconditioning.html">residential service</a>, <a href="installac.html">installation</a>, <a href="repairairconditioning.html">repair</a>, <a href="salesairconditioning.html">sales</a> and <a href="maintainac.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="alsip.html">Alsip</a>, <a href="burbank.html">Burbank IL</a>, <a href="burrridge.html">Burr Ridge</a>, <a href="chicagoridge.html">Chicago Ridge</a>, <a href="countryside.html">Countryside</a> and <a href="ourservicearea.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairairconditioning.html">AC Repair Service</a></p></td>
          <th width="285" valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/air-conditioning-repair-services.png" width="270" height="200" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="repairairconditioning.html">Air Conditioning Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="repairfurnace.html">Heating Repair Service</a></strong></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a full service <a href="repairfurnace.html">heating repair</a> or <a href="repairfurnace.html">furnace repair</a> company providing <a href="commercial-rooftop-repair.html">commercial HVAC repair</a> and <a href="repair.html">residential HVAC service</a>, <a href="furnace-installation.html">installation</a>, <a href="repairfurnace.html">repair</a>, <a href="salesfurnace.html">sales</a> and <a href="maintainfurnace.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="crestwood.html">Crestwood</a>, <a href="darien.html">Darien</a>, <a href="evergreenpark.html">Evergreen Park</a>, <a href="flossmoor.html">Flossmoor</a>, <a href="frankfort.html">Frankfort IL</a> and <a href="ourservicearea.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairfurnace.html">Heating Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairfurnace.html"><img src="/Assets/Images/heating-repair-services.png" width="270" height="200" alt="Heating Repair Services"></a></p>
            <p><a href="repairfurnace.html">Heating Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="walk-in-cooler-repair.html">Commercial Refrigeration Repair Service</a></strong></h2>      
             <p>Sub Zero Refrigeration Heating and Air Conditioning is a full service <a href="refrigeration-repair.html">refrigeration repair</a> company providing <a href="refrigeration-repair.html">service</a>, <a href="refrigeration.html">installation</a>, <a href="refrigeration-repair.html">repair</a>, <a href="refrigeration-sales.html">sales</a> and <a href="maintaincommercialrefrig.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="hickoryhills.html">Hickory Hills</a>, <a href="hinsdale.html">Hinsdale</a>, <a href="homerglen.html">Homer Glen</a>, <a href="homerglen.html">Goodings</a>, <a href="hometown.html">Hometown</a>, <a href="homewood.html">Homewood</a> and <a href="ourservicearea.html">surrounding communities</a>. <br>
          Read More&gt;&gt;  <a href="/refrigeration-repair.html">Commercial Refrigeration Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><img src="/commercial-refrigeration-repair.png" width="270" height="200" alt="Commercial Refrieration Repair"></p>
            <p><a href="/refrigeration-repair.html"> Refrigeration Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="iaqaprilairehumidifier.html">Humidifier Repair Service</a></strong></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a factory authorize Trane, Honeywell and Aprilaire sales, <a href="iaqaprilairehumidifier.html">installation</a> and <a href="iaqaprilairehumidifier.html">service company</a> in the <a href="ourservicearea.html">Suburban Chicago</a> towns including <a href="lagrange.html">La Grange</a>, <a href="lagrangepark.html">La Grange Park</a>, <a href="lemont.html">Lemont</a>, <a href="lockport.html">Lockport</a>, <a href="manhattan.html">Manhattan IL</a>, <a href="midlothian.html">Midlothian</a>, <a href="mokena.html">Mokena</a>, <a href="monee.html">Monee</a> and surrounding <a href="chicago.html">Chicago</a> <a href="ourservicearea.html">communities.</a><br>
              Read More&gt;&gt; <a href="iaqaprilairehumidifier.html">Humidifier   Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="http://www.sub-zero-refrigeration.com/Assets/Images/humidifier-repair.jpg" alt="Humidifier Repair by Sub Zero Refrigeration" height="250" width="250"></a></p>
            <p><a href="iaqaprilairehumidifier.html">Humidifier Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><h2><strong><a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a></strong> <a href="walk-in-freezer-repair.html"><strong>Walk in Freezer Repair Service</strong></a></h2>
            <p>Sub Zero Refrigeration Heating and Air Conditioning is a <a href="walk-in-cooler-repair.html">full service walk in cooler and freezer repair</a> company providing <a href="repairrooftop.html">commercial service</a>, <a href="walk-in-cooler-repair.html">installation</a>, <a href="repairairconditioning.html">repair</a>, <a href="walk-in-cooler-sales.html">sales</a> and <a href="walk-in-freezer-maintenance.html">maintenance</a> to <a href="ourservicearea.html">Suburban Chicago towns</a> including <a href="newlenox.html">New Lenox</a>, <a href="oakforest.html">Oak Forest</a>, <a href="oaklawn.html">Oak Lawn</a>, <a href="orlandhills.html">Orland Hills</a>, <a href="orlandpark.html">Orland Park</a>, <a href="palosheights.html">Palos Heights</a>, <a href="paloshills.html">Palos Hills</a> and <a href="ourservicearea.html">surrounding communities.</a><br>
              Read More&gt;&gt; <a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a> <a href="walk-in-freezer-repair.html">Walk in Freezer Repair Service</a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/nikohome.png" width="270" height="145" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="walk-in-cooler-repair.html">Walk in Cooler Repair Service</a></p>
            <p><a href="walk-in-freezer-repair.html">Walk in Freezer Repair Service </a></p>
          </div></th>
        </tr>
        <tr>
          <td scope="col"><p><a href="reach-in-cooler-repair.html"><strong>Commercial Refrigerator Repair</strong></a><strong> and <a href="reach-in-freezer-repair.html">Commercial Freezer Repair </a></strong><a href="reach-in-freezer-repair.html"></a><br>
            Sub Zero Refrigeration Heating and Air Conditioning is a <a href="repairairconditioning.html">full service refrigeration repair</a> company providing <a href="reach-in-cooler-repair.html">reach in cooler service</a> and <a href="reach-in-freezer-repair.html">reach in freezer service</a>, <a href="reach-in-freezer-installation.html">reach in installation</a>, <a href="reach-in-freezer-repair.html">reach in repair</a>, <a href="reach-in-cooler-sales.html">reach in sales</a> and <a href="reach-in-cooler-maintenance.html">reach in maintenance</a> to Suburban <a href="chicago.html">Chicago</a> towns including <a href="palospark.html">Palos Park</a>, <a href="peotone.html">Peotone</a>, <a href="steger.html">Steger</a>, <a href="tinleypark.html">Tinley Park</a>, <a href="willowsprings.html">Willow Springs</a>, Willowbrook, <a href="worth.html">Worth</a> and <a href="ourreviews.html">surrounding communities</a>.<br>
          Read More&gt;&gt; <a href="repairairconditioning.html"></a><a href="reach-in-cooler-repair.html">Commercial Refrigerator Repair</a> and <a href="reach-in-freezer-repair.html">Commercial Freezer Repair </a></p></td>
          <th valign="top" scope="col"><div align="center">
            <p><a href="repairairconditioning.html"><img src="/Assets/Images/DSCF0092.png" width="243" height="177" alt="Air Conditioning Repair Services"></a></p>
            <p><a href="walk-in-cooler-repair.html">Commercial Refigeration  Repair Service</a></p>
          </div></th>
        </tr>
        <tr>
          <td colspan="2" scope="col"><p>Blog Updates Coming Soon.</p></td>
        </tr>
      </table>
      <tr>
      <td width="809"><!-- InstanceEndEditable -->
      <!-- end .content -->
        <!--Page Footer-->
      <div align="left" class="footerblue" id="footer"> </div>
      <div align="center" class="footerblue" id="footer">
        <table width="900" border="0" align="center" cellpadding="5" cellspacing="3" bgcolor="#B7E4EA" id="background_blue">
          <tr align="center" class="background_blue" style="text-align: center;">
            <td valign="middle" class="table_blue_background" id="background_blue" scope="col"><p align="center" class="background_blue"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/service_1.png" alt="Schedule a Service Call online for Sub Zero Refrigeration" width="105" height="85"></a></a></td>
            <td valign="middle" class="table_blue_background" id="background_blue" scope="col"><p align="center" class="background_blue"><a href="https://www.facebook.com/subzerorefrig" target="_new"><img src="/Assets/Images/facebook.png" alt="Find us on Facebook Sub Zero Refrigeration " name="background_blue2" width="100" height="100" id="background_blue2" /></a></p></td>
            <td id="background_blue" scope="col"><a href="http://www.twitter.com/subzerorefrig" target="_new"><img src="/Assets/Images/twitter_follow.gif" alt="Follow us on Twitter Sub Zero Refrigeration" width="89" height="45" border="0" class="background_blue" /></a></td>
            <td id="background_blue" scope="col"><div align="center"><a href="http://www.youtube.com/user/mrsubzerorefrig" target="_new"><img src="/Assets/Images/you-tube.jpg" width="75" height="75" alt="Watch us on YouTube Sub Zero Refrigeration" longdesc="http://www.youtube.com/mrsubzerorefrig"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new"><img src="/Assets/Images/google+.png" width="100" height="100" alt="Review Us on Google Plus Sub Zero Refrigeration " longdesc="https://plus.google.com/u/0/108598412013907889976/posts"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="http://www.bbb.org/chicago/business-reviews/heating-and-air-conditioning/sub-zero-refriger ation-in-midlothian-il-7695" target="_new"><img src="/Assets/Images/BBB.png" width="133" height="75" alt=" Sub Zero Refrigeration and Chicago Better Business Bureau"></a></div></td>
            <td id="background_blue" scope="col"><div align="center"><a href="/schedule-a-free-estimate.html"><img src="/Assets/Images/estimate_1.png" width="158" height="85" alt="Schedule a Free Estimate Online for Sub Zero Refrigeration"></a></a></div></td>
          </tr>
        </table>
        <table border="0" cellpadding="0" cellspacing="0" class="footerblue">
          <tr>
            <th class="footerblue" style="font-family: Arial, Helvetica, sans-serif" scope="col"><div align="left"><span class="footer"><img src="/Assets/Images/truck.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning Chicago" width="240" height="109" align="left"></span><span class="footerblue" style="font-family: Arial, Helvetica, sans-serif"><span class="footer"><img src="/Assets/Images/footer_right.jpg" alt="Sub Zero Refrigeration Heating and Air Conditioning" width="717" height="109" align="left"></span></span>
            </div>
              <p class="footer">QUICK LINKS</p>
              <p class="footer"><a href="/index.html" >Home</a> | <a href="/financing.html">Financing</a> | <a href="/aboutus.html">About Us</a> | <a href="/repair.html" >Repair</a> | <a href="/sales.html" >Sales</a> | <a href="/maintain.html" >Maintenance</a> | <a href="/products.html" >Products</a> | <a href="/jobphotos.html" >Our Job Photos</a> | <a href="/savings.html" >Cool Savings</a> | <a href="/social.html"  target="_new">Social</a> | <a href="/contactus.html" >Contact Us</a> | <a href="/schedule-a-free-estimate.html" >Schedule Free New Equipment Estimate</a> | <a href="/schedule-a-free-estimate.html">Schedule Service</a><br>
                <a href="/repairairconditioning.html">Air Conditioning Repair</a> | <a href="/repairfurnace.html" >Heating Repair</a> | <a href="repairheatpump.html">Heat Pump Repair</a> | <a href="/repairiaq.html" >Humidifier Repair</a><br>
    <a href="/repairrooftop.html">Commercial Air Conditioning Repair</a> | <a href="/refrigeration-repair.html" >Refrigeration Repair</a> | <a href="/commercial-ice-maker-repair.html" > Ice Maker Repair</a> | <a href="/walk-in-cooler-repair.html">Walk In Cooler Repair</a><br />
              </p>
              <div>
                <div align="center">
              </div>
                <address align="center" class="footer">Sub Zero Refrigeration is located at 3662 147th St. Midlothian, Illinois 60445</address>  <p align="center" class= "footer"> Our suburban Chicago refrigeration heating and air conditioning repair service provides professional service throughout <a href="/orlandpark.html">Orland Park</a> | <a href="/oaklawn.html">Oak Lawn</a> | <a href="/tinleypark.html">Tinley Park</a> | <a href="/oakforest.html">Oak Forest</a> | <a href="/frankfort.html">Frankfort, IL</a> | <a href="newlenox.html">New Lenox</a> and <a href="/ourservicearea.html">The Suburbs</a>. Read our<a href="https://plus.google.com/108215910665703095824/about?gl=us&hl=en" target="_new"> Reviews on Google+ Local</a>, <a href="http://bit.ly/ND2dsc" target="_new">Yelp Reviews</a>, <a href="http://bit.ly/LDEY6c" target="_new">Insider Pages</a>, and <a href="http://bit.ly/MUC9eG">Chicago City Search  Reviews</a>, on-line. Come visit our office in <a href="/midlothian.html">Midlothian, IL.</a> <br>
                  <a href="alsip.html">Alsip Refrigeration and Ice Machines</a> <a href="burbank.html">Burbank Refrigeration and Ice Machines</a>  <a href="burrridge.html">Burr Ridge Refrigeration and Ice Machines</a> <a href="chicagoridge.html">Chicago Ridge Refrigeration and Ice Machines</a> <a href="countryside.html">Countryside Refrigeration and Ice Machines</a> <a href="crestwood.html">Crestwood Refrigeration and Ice Machines</a>  <a href="darien.html">Darien Refrigeration and Ice Machines</a> <a href="evergreenpark.html">Evergreen Park Refrigeration and Ice Machines</a> <a href="flossmoor.html">Flossmoor Refrigeration and Ice Machines</a> <a href="frankfort.html">Frankfort Refrigeration and Ice Machines</a>  <a href="hickoryhills.html">Hickory Hills Refrigeration and Ice Machines</a> <a href="hinsdale.html">Hinsdale Refrigeration and Ice Machines</a> <a href="homerglen.html">Homer Glen Refrigeration and Ice Machines</a> <a href="homerglen.html">Goodings Refrigeration and Ice Machines</a> <a href="hometown.html">Hometown Refrigeration and Ice Machines</a> <a href="homewood.html">Homewood Refrigeration and Ice Machines</a>  <a href="lagrange.html">La Grange Refrigeration and Ice Machines</a> <a href="lagrangepark.html">La Grange Park Refrigeration and Ice Machines</a> <a href="lemont.html">Lemont Refrigeration and Ice Machines</a> <a href="lockport.html">Lockport Refrigeration and Ice Machines</a> <a href="manhattan.html">Manhattan IL Refrigeration and Ice Machines</a> <a href="midlothian.html">Midlothian IL Refrigeration and Ice Machines</a> <a href="mokena.html">Mokena Refrigeration and Ice Machines</a> <a href="monee.html">Monee Refrigeration and Ice Machines</a> <a href="newlenox.html">New Lenox Refrigeration and Ice Machines</a> <a href="oakforest.html">Oak Forest Refrigeration and Ice Machines</a> <a href="oaklawn.html">Oak Lawn Refrigeration and Ice Machines</a> <a href="orlandhills.html">Orland Hills Refrigeration and Ice Machines</a> <a href="orlandpark.html">Orland Park Refrigeration and Ice Machines</a> <a href="palosheights.html">Palos Heights Refrigeration and Ice Machines</a> <a href="paloshills.html">Palos Hills Refrigeration and Ice Machines</a> <a href="palospark.html">Palos Park Refrigeration  T</a><a href="tinleypark.html">inley Park Refrigeration and Ice Machines</a> <a href="willowsprings.html">Willow Springs Refrigeration and Ice Machine </a> <a href="willowbrook.html">Willowbrook Refrigeration and Ice Machines</a> <a href="worth.html">Worth Refrigeration and Ice Machines</a></p>
                <p align="center" class="footer">2012&copy; Sub Zero Refrigeration - Last Day Updated -
                  <!-- #BeginDate format:Am1 -->February 18, 2013<!-- #EndDate -->
                  <a href="/sitemap.xml">Site Map</a>         | <a href="sub-zero-news.html">Sub Zero Refrigeration in the NEWS</a>       
                <p align="center" class="footer">Web-master Ted Wagner - Web designer Cherie White Cachampis</div></p></th>
        </table>
    <script type="text/javascript">
    var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"/SpryAssets/SpryMenuBarDownHover.gif", imgRight:"/SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </div>
      <!-- end .footer -->
    </div>
    <!-- end .container -->
    </body>
    <!-- InstanceEnd --></html>

  • Missing Spry Menu Tab on CS5 using an iMac (only 2 computers cannot see it)

    I am using Dreamweaver CS5 on iMacs in my classroom. Two students are not able to see the blue Spry Menu Bar tab.  Is there something that needs to be selected in order for them to see it?  I thought maybe they missed a step so we followed our book and recreated the Menu Bar on another page.  Once the menu bar is complete and you click off, the blue Spry Menu Tab is not available.  Any suggestions would be greatly appreciated.

    Hello,
    even if there are only two students with these problems, you should follow Ken's hint. One of my most important arguments: "Spry doesn't work correctly on touch screens!" Please try it, you will have a nasty surprise!
    And here 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. We/I recommend you switch to a jQuery library for your further requirements."
    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/
    http://www.solutions4website.com/Extensions/nova_dropdown_menu.aspx
    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/
    Hans-Günter

  • SPRY Menu Focus State

    To eliminate the fuzzy line around the boxes, I understand
    how to in Accordion and other SPRY. But, I can not figure it out in
    SPRY Menu with both the main and sub menus.
    Can someone please advise as to what Style is needed? For
    example "TabbedPanelsTab:Focus, but for SPRY Menu. ??
    Regards,
    John M

    You're probably looking for this one:
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    in SpryMenuBarHorizontal.css or this one:
    ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
    in SpryMenuBarVertical.css.
    Best - Joe
    Joseph Lowery
    Vice President of Marketing, WebAssist
    Author of Dreamweaver CS3 Bible
    "mcgregorlink" <[email protected]> wrote in
    message
    news:fleia0$ihc$[email protected]..
    >
    > To eliminate the fuzzy line around the boxes, I
    understand how to in
    > Accordion
    > and other SPRY. But, I can not figure it out in SPRY
    Menu with both the
    > main
    > and sub menus.
    >
    > Can someone please advise as to what Style is needed?
    For example
    > "TabbedPanelsTab:Focus, but for SPRY Menu. ??
    > Regards,
    >
    > John M
    >

  • Spry Menu and iframe

    Hi, I want to link my spry menu to my iframe, so when I click on something on my menu, a different page will show up on the iframe, can someone please explain to me how to do this? Thanks

    Here some other links, maybe you prefer words instead of a video:
    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/
    http://www.solutions4website.com/Extensions/nova_dropdown_menu.aspx
    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/

  • Insert collapsible panel in Spry menu

    Hi,
    Can a collapsible panel be inserted into a Spry menu.
    When clicked, I would like one of my menu items to slide open exposing another menu. Kind of a sub catagory of the menu item.
    Sorry for the poor discription.
    Thanks
    Dennis

    I think that an accordion will serve you purpuse better. Have a look at the following
    <!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>Old English Sheepdog Club of America</title>
    <link href="/css/oescaHRC.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css">
    <script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryDOMUtils.js" type="text/javascript"></script>
    </head>
    <body>
    <div class="container">
      <div class="header"><img src="images/header_03.gif" alt="OESCA Banner" width="789" height="239" />
        <!-- end .header --></div>
      <div class="sidebar1">
        <div id="Accordion1" class="Accordion" tabindex="0">
          <div class="AccordionPanel">
            <div class="AccordionPanelTab"><a href="http://www.oldenglishsheepdogclubofamerica.org/" title="OESCA home page">Home - OESCA</a></div>
            <div class="AccordionPanelContent"><!-- no content --></div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab"><a href="index.php" title="OES Health home page">Home - OES Health</a></div>
            <div class="AccordionPanelContent"><!-- no content --></div>
          </div>
          <div class="AccordionPanel">
            <div class="AccordionPanelTab"><!-- no link just open panel -->Cerebellar Abiotrophy Center</div>
            <div class="AccordionPanelContent">
             <ul>
               <li><a href="#" title="CA Infected Dogs">CA Infected Dogs</a></li>
               <li><a href="#" title="Video's of Infected Dogs">Video's of Infected Dogs</a></li>
               <li><a href="#" title="CA Articles">CA Articles</a></li>
             </ul>
            </div>
          </div>
        </div>
    <img src="images/animations/32402508.gif" width="130" height="182" alt="Vet Dog" /><br />
    <!-- end .sidebar1 --></div>
    <div class="content">
      <!-- begin .content -->
      <h1>OES Health &amp; Open Health Registry</h1>
      <h1>The Official Online Resource...<br />
        Promoting the Health &amp;   Welfare of the OES</h1>
      <h2>from the OESCA Health &amp; Research Committiee</h2>
      <br />
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <p> </p>
      <!-- end .content -->
    </div>
      <div class="footer"> This site belongs to the Old English Sheepdog Club of America, Inc. <br />
        No part can be linked to or copied without express permission of the Old English Sheepdog club of America, Incorporated<br />
    <br />
    Web Design by Idea Patio Creative Services
      <!-- end .footer --></div>
      <!-- end .container --></div>
    <script>
    var Accordion1 = new Spry.Widget.Accordion("Accordion1");
    // the event listener to override the default tab behaviour when clicked
    Spry.$$('.Accordion a').addEventListener('click',function(){return window.location = this.href;},true);
    </script>
    </body>
    </html>
    The above is only an example to give you an idea of what the outcome can be when using an accordion. You will still need to tweak your CSS to suit.
    I hope this helps.
    Ben

  • Spry menu problems

    When inserting spry accordion and spry collapsible menus from
    dreamweaver cs3 in a blank html page i get a javascript error and
    continue to get them making the use of these spry menus unworkable.
    The error says" While executing inspectSelection in
    spry_accordion.htm, a Javascript error occured." Does anyone know
    of a fix to this problem?

    Hi Lucaandluna,
    Well the website page I have linked was done in Dreamweaver
    MX (think thats version 8) and I used the Pop Up Menu behaviour in
    that program. Its a great little tool and you can change the sub
    menu text and box size and much more. BUT I can not easily copy
    this to other pages as when I do copy it looses all the information
    on the Drop down menu. Thus for every page on my website I have to
    change each Drop Down menu by hand which is a very time consuming
    process. Thus I want to use a CSS menu system so I only have to
    updage the Drop Down menu once for the whole site.
    So I have the same problem with the sub menu text, I can't
    seem to figure out how to make the colour different from the main
    menu. For the look of my Spry Menu I have been altering the Spry
    CSS file. IF you don't want thos little arrows then look in the CSS
    file for something called Submenu Indication. There you will find
    the Gif files for the arrows, delete the ones u don't want.

  • Spry menu bar woes (add submenu levels and edit width)

    So i need some spry menu bar help. Apparently as a graphic designer i'm also expected to webdesign, and while i can solve most problems with a good googling, i seem to be at  my wit's end fo this one.  So the site i'm doing has a header ith a horizontal spry pop-up menubar (in Dreamweaver CS4). But some problems arise:  when i manually add another submenu level, they don't show up in chrome or FF, they do werk perfectly in IE6. I just add the following code to the codepage:
    <li><a href="#" class="MenuBarItemSubmenu">audio equipment</a>             <ul>               <li><a href="#">Digital Matrix Systems</a></li>               <ul>               <li><a href="#">R2 Digital Audio Matrix</a></li>               </ul>               <li><a href="#">pre-amplifiers &amp; mixers</a></li>               <ul>               <li><a href="#">PMX124</a></li>               </ul>
    the PMX never pops open in FF an chrome.. Should i be adding anything else to another part of the code?  i'd like my submenu text to have a slight indent? How ever, when i add the indent to ul.menubarhorizontal ul , it elongates the submeny boxes in IE6, while looking normal (width) in chrome and FF. WHat part of the CSS style should i change to just have the text scoot over a bit without it really affecting the box layout? ALso, if anyone could tell me how to add a wee bit of spacing above the text (and beneath), i'd be eternally gratefull.  Also, how do i change the with of the submenus? seing as my main buttons are images, but the names i ned to put in my submenus are turning out to be pretty long...
    HTML code for the menu:
    <tr>     <td><ul id="MenuBar1" class="MenuBarHorizontal">       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Products','','images/knoppenrollover_01.jpg',1)"><img src="images/knoppenbalk_01.jpg" name="Products" width="169" height="41" border="0" id="Products" /></a>         <ul>           <li><a href="#" class="MenuBarItemSubmenu">audio equipment</a>             <ul>               <li><a href="#">Digital Matrix Systems</a></li>               <ul>               <li><a href="#">R2 Digital Audio Matrix</a></li>               </ul>               <li><a href="#">pre-amplifiers &amp; mixers</a></li>               <ul>               <li><a href="#">PMX124</a></li>               </ul>               <li><a href="#">music Sources</a></li>               <li><a href="#">amplifiers</a></li>               <li><a href="#">paging</a></li>               <li><a href="#">speakers</a></li>               <li><a href="#">microphones</a></li>             </ul>           </li>           <li><a href="#">racks and stands</a></li>           <li><a href="#">cables</a></li>         </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Company','','images/knoppenrollover_02.jpg',1)"><img src="images/knoppenbalk_02.jpg" name="Company" width="165" height="41" border="0" id="Company" /></a>         <ul>           <li><a href="#">Who are we?</a></li>           <li><a href="#">history</a></li>   <li><a href="#">contact us</a></li>   <li><a href="#">philosophy</a></li>   <li><a href="#">careers</a></li>         </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('news','','images/knoppenrollover_03.jpg',1)"><img src="images/knoppenbalk_03.jpg" name="news" width="166" height="41" border="0" id="news" /></a></li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('projects','','images/knoppenrollover_04.jpg',1)"><img src="images/knoppenbalk_04.jpg" name="projects" width="166" height="41" border="0" id="projects" /></a></li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Downloads','','images/knoppenrollover_05.jpg',1)"><img src="images/knoppenbalk_05.jpg" name="Downloads" width="165" height="41" border="0" id="Downloads" /></a>         <ul>           <li><a href="#">catalogs</a>            </li>           <li><a href="#">manuals</a></li>           <li><a href="#">software</a></li>           <li><a href="#">documents</a></li>           <li><a href="#">pricelists</a></li> </ul>       </li>       <li><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','images/knoppenrollover_06.jpg',1)"><img src="images/knoppenbalk_06.jpg" name="Contact" width="169" height="41" border="0" id="Contact" /></a></li>     </ul></td>
    sprymenuhorizontal.css:
    @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: 0;      padding: 0;      list-style-type: none;      font-size: 14px;      cursor: default;      width: 1010px;      font-family: Arial, Helvetica, sans-serif; } /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: [url]http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html[/url] */ 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;      text-align: left;      cursor: pointer;      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 {      list-style-type: none;      font-size: 100%;      z-index: 1020;      cursor: default;      width: 166px;      position: absolute;      left: -1000em;      background-color: #6C6C6C;      height: 0px;      margin-top: 0px;      margin-right: 0em;      margin-bottom: 10px;      margin-left: 0em;      text-align: right;      text-indent: 0em;      padding-top: 0px;      padding-right: 0em;      padding-bottom: 0px;      padding-left: 0px;      border-top-width: 1px;      border-right-width: 1px;      border-bottom-width: 1px;      border-left-width: 1px;      border-top-style: solid;      border-right-style: solid;      border-bottom-style: solid;      border-left-style: solid;      border-top-color: #666;      border-right-color: #666;      border-bottom-color: #666;      border-left-color: #666; } /* 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;      height: 0px; } /* Menu item containers are same fixed width as parent */ ul.MenuBarHorizontal ul li {      width: 166px; } /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ ul.MenuBarHorizontal ul ul {      position: absolute;      height: 41px;      margin-top: 0%;      margin-right: 0%;      margin-bottom: 0px;      margin-left: 162px;      float: right; } /* 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 #666;      background-color: #6C6C6C;      height: 0px;      padding-left: 0em; } /* Menu items are a light gray block with padding and no text decoration */ ul.MenuBarHorizontal a {      display: block;      cursor: pointer;      background-color: #6C6C6C;      padding: 0em;      color: #FC0;      text-decoration: none;      font-size: 14px;      margin-left: 0em; } /* 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: #FC0;      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 {      background-color: #FC0;      color: #FFF; }  /*******************************************************************************   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: 98% 50%; } /* 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: 98% 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: 98% 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: 98% 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;      } }[/SPOILER]  any help would be greatly appreciated, as i've been fidgiting with this thing for 2 days now, to no satisfying effect...

    since the layout of the pasted text got all weird, here i'm trying it again.
    sprymenubarhorizontal.css:
    @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: 0;
    padding: 0;
    list-style-type: none;
    font-size: 14px;
    cursor: default;
    width: 1010px;
    font-family: Arial, Helvetica, sans-serif;
    /* 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;
    text-align: left;
    cursor: pointer;
    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
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 166px;
    position: absolute;
    left: -1000em;
    background-color: #6C6C6C;
    height: 0px;
    margin-top: 0px;
    margin-right: 0em;
    margin-bottom: 10px;
    margin-left: 0em;
    text-align: right;
    text-indent: 0em;
    padding-top: 0px;
    padding-right: 0em;
    padding-bottom: 0px;
    padding-left: 0px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: #666;
    border-right-color: #666;
    border-bottom-color: #666;
    border-left-color: #666;
    /* 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;
    height: 0px;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
    width: 166px;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
    position: absolute;
    height: 41px;
    margin-top: 0%;
    margin-right: 0%;
    margin-bottom: 0px;
    margin-left: 162px;
    float: right;
    /* 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 #666;
    background-color: #6C6C6C;
    height: 0px;
    padding-left: 0em;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-color: #6C6C6C;
    padding: 0em;
    color: #FC0;
    text-decoration: none;
    font-size: 14px;
    margin-left: 0em;
    /* 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: #FC0;
    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
    background-color: #FC0;
    color: #FFF;
    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: 98% 50%;
    /* 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: 98% 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: 98% 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: 98% 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;

  • How can I add more than one same spry menu (eg. collapsible menu)  with in different styles (font size, color, background, etc) on current page?

    How can I add more than one same spry menu (eg. collapsible menu)  with in different styles (font size, color, background, etc) on current page?

    Hi Nancy,
    This screenshot was only for imagination. A part of the code (not all) is below.  In the code there are some background images but they are not seem in live mode.
    <!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></title>
    <link href="css/my_site.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css"/>
    <link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
    <style>
    #CollapsiblePanel1 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-color: #003366;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel1 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        line-height: 52px;
    #CollapsiblePanel1 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/international.jpg);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel2 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelContent {
        background-color: blue;
    #CollapsiblePanel3 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel3 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel3 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel4 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel4 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel4 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel5 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel5 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel5 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    </style>

  • Spry menu bar doesn't appear correctly in IE

    Hi guys..
    I created a spry menu bar in DW CS4. It looks fine in Firefox but in IE 8, the background image of the navigation bar appears white after allowing activecontrol to run. I didn't include any image for ul.MenuBarHorizontal a because I wanted to use the background image for the div containing the navigation bar.(Hope I didn't confuse you there).. I tried using the search box but couldn't find any solution to my problem. Here are my screen shots.
    This is in firefox.
    This is in IE 8 before allowing activex.
    This is in IE 8 after allowing activex. (Part of the navigation bar is white)
    Here's the code.Hope you can help me asap. Thanks!
    @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: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: 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;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: center;
        cursor: pointer;
        width: 9em;
        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: 9em;
        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: 9em;
    /* 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;
        background-image: url(../images/single.jpg);
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        color: #000;
        text-decoration: none;
        padding-top: 1.05em;
        padding-right: 0.75em;
        padding-bottom: 1.05em;
        padding-left: 0.75em;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        color: #FFF;
        background-image: url(../images/single.jpg);
    /* 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
        color: #FFF;
    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-repeat: no-repeat;
        background-position: 95% 50%;
    /* 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-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(../images/single.jpg);
        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-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;

    /* 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;
    I hope this helps.
    Ben

  • Spry Menu Bar css not compatible with IE7? or compatibility View on IE8?

    Well i've made my website
    . Swimmerbuddy.com
    Problem:I used the spry menu bar on a div tag. I've got it working fine on several browser and so on.. but hmm. i noticed that IE7 and only on compatibility view of IE8 it does not work...
    It seems like the drop down menus get cover by the main content underneath it..
    I started of with dwt i made my self.This is the DWT and the css that controll the dwt and the spry menu bar.
    PLZ HELP ME.. THANKS
    THIS IS THE DWT THAT THE PAGE RUNS ON
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Untitled Document</title>
    <!-- TemplateEndEditable -->
    <link href="../CSS/main.css" rel="stylesheet" type="text/css" />
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <style type="text/css">
    a:link {
    color: #000;
    text-decoration: none;
    </style>
    <script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    a:visited {
    color: #000;
    text-decoration: none;
    a:hover {
    text-decoration: none;
    color: #000;
    a:active {
    text-decoration: none;
    </style>
    </head>
    <body>
    <div id="wrapper">
      <div id="header">
        <div id="networkicons"><a href="http://www.facebook.com/?ref=logo#!/profile.php?id=100001554936595" target="_blank"><img src="../_images/facebook.png" alt="facebook.com" width="45" height="45" border="0" title="facebook.com"/></a><a href="http://www.myspace.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/myspace.png" alt="myspace.com" width="44" height="45" border="0" title="myspace.com"/></a><a href="http://twitter.com/swimmerbuddy" TARGET="_blank"> <img src="../_images/twitter.png" alt="twitter.com" width="43" height="45" border="0" title="twitter.com"/></a><a href="http://www.youtube.com/swimmerbuddy1" TARGET="_blank"> <img src="../_images/youtube.png" alt="youtube.com" width="44" height="45" border="0" title="youtube.com"/></a></div>
        <div id="buyNow1">
          <p><a href="../order_now.html"><img src="../buynowbutton.png" alt="bt1" width="130" height="25" border="0" longdesc="Order Your Swimmer Buddy Today!!" /></a></p>
        </div>
      </div>
      <div id="mainNav">
        <ul id="mainNavcontent" class="MenuBarHorizontal">
          <li><a href="../index.htm">Home</a>        </li>
          <li><a href="../swimmer.html">Swimmer Buddy</a></li>
          <li><a href="../order_now.html">Order Now</a>        </li>
          <li><a href="#" class="MenuBarItemSubmenu">Gallery</a>
            <ul>
              <li><a href="../photo_gallery.html">Photos</a></li>
              <li><a href="../video_gallery.html">Videos</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">Zinger Products</a>
            <ul>
              <li><a href="http://www.winkyscoop.com/">Winky Scoop</a></li>
              <li><a href="http://www.1800succeed.com/">Hypmovation</a></li>
              <li><a href="http://www.1800succeed.org/">1800SUCCEED</a></li>
              <li><a href="http://www.zingerproducts.com">Zinger Store</a></li>
            </ul>
          </li>
          <li><a href="../about.html">About Us</a></li>
          <li><a href="../contact.html">Contact Us</a></li>
        </ul>
      </div>
      <!-- TemplateBeginEditable name="mainContent" -->
      <div id="pageInfo">
        <div id="info_page">
          <p class="regionID">Region ID</p>
          <hr class="breaklinePageInfo" />
          <p class="breadcrum">&gt; <a href="../index.htm">Breadcrum </a></p>
        </div>
        <div id="mainContent">
          <div id="content">
            <p>Main Content Goes her</p>
          </div>
        </div>
      </div>
      <!-- TemplateEndEditable -->
      <!-- TemplateBeginEditable name="buynow2" -->
       <div id="buyNow2"><a href="../order_now.html"><img src="../buynowbutton.png" width="130" height="25" /></a></div>
       <!-- TemplateEndEditable -->
      <div id="footer">
    <div id="footertext">
            <p class="footertextclass">Copyright © 2010 SwimmerBuddy.com. All rights reserved. SwimmerBuddy.com is part of <a href="http://www.zingerproducts.com" class="footertextclass">Zinger Products</a>. Designated Trademarks and brands are the property of their respective owners. This page was last modified Setember 28,2010. Swimmer Buddy - Pattent Pending 2010</p>
          </div>
        <div id="footerlinks">
            <p classs="footerlinkspacing"> <span class="footerlinkspacing"><a href="../Disclaimer.html">Disclaimer</a><a href="../terms.html"> Term of Service </a><a href="../contact.html">Contact Us</a></span>
    </div>
          </div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("mainNavcontent", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    THIS IS THE MAIN.CSS
    @charset "utf-8";
    #networkicons {
    height: 50px;
    width: 200px;
    margin-top: 160px;
    margin-left: 15px;
    position: absolute;
    #wrapper {
    width: 933px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
    text-align: left;
    position: relative;
    #mainNav {
    text-align: center;
    position: relative;
    margin-right: auto;
    margin-left: auto;
    width: 934px;
    padding-bottom: 15px;
    clear: both;
    overflow: visible;
    #navwrapper {
    width: 935px;
    margin-right: auto;
    margin-left: auto;
    #mainContent {
    width: 910px;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
    padding-bottom: 20px;
    padding-top: 20px;
    #content {
    width: 910px;
    position: relative;
    #wrapper #footer #footerlinks p .footerlinkspacing a {
    margin-right: 20px;
    #footer {
    width: 930px;
    background-color: #fff;
    position: relative;
    margin-top: 5px;
    text-align: center;
    color: #000;
    padding-bottom: 10px;
    margin-bottom: 15px;
    #header {
    width: 930px;
    height: 209px;
    background-image: url(../_images/header.jpg);
    background-repeat: no-repeat;
    #buyNow1 {
    height: 25px;
    width: 140px;
    float: right;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    background-repeat: no-repeat;
    color: #666;
    padding: 5px;
    position: absolute;
    top: 160px;
    right: 150px;
    .buyNow1 {
    color: #666;
    #wrapper #pageInfo #info_page .breadcrum {
    color: #003;
    #wrapper #pageInfo #info_page .breadcrum a {
    color: #003;
    html, body {
    margin: 0px;
    padding: 0px;
    #buyNow2 {
    height: 25px;
    width: 130px;
    float: right;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-align: center;
    padding: 5px;
    position: relative;
    #wrapper #buyNow2 a img {
    position: absolute;
    top: -30px;
    right: 50px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    #pageInfo {
    width: 930px;
    background-image: url(../_images/pageinfobackground.jpg);
    background-repeat: repeat-x;
    background-color:#FFF;
    text-align: left;
    padding-bottom: 15px;
    margin-top: 18px;
    position: relative;
    overflow: visible;
    visibility: visible;
    #wrapper #mainNav #mainNavcontent {
    position: absolute;
    left: 0px;
    width: 930px;
    .regionID {
    font-size: 2em;
    font-weight: bold;
    color: #FFC;
    margin-top: 1em;
    margin-bottom: 0em;
    text-align: left;
    margin-left: 5px;
    .breaklinePageInfo {
    margin-top: 0.5em;
    color: #FAFEAB;
    .breadcrum {
    color: #003;
    font-size: 1.1em;
    font-weight: bold;
    text-decoration: underline;
    margin-top: -0.2em;
    margin-left: 15px;
    #breadcrum {
    font-weight: bold;
    color: #003;
    #footertext {
    width: 910px;
    font-size: 0.6em;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
    #footerlinks {
    width: 930px;
    font-size: 0.7em;
    font-weight: bold;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    color: #000;
    position: relative;
    margin-top: 10px;
    margin-bottom: 5px;
    .footertextclass {
    color: #000;
    .footerlinkspacing {
    margin-top: -0.5em;
    color: black;
    height: 10px;
    font-style: normal;
    line-height: normal;
    font-variant: normal;
    letter-spacing: normal;
    p {
    margin: 0px;
    padding: 0px;
    body {
    text-align: center;
    margin-top: 5px;
    background-color: #073e78;
    background-image: url(../_images/background.jpg);
    background-repeat: repeat-x;
    background-attachment: scroll;
    font-size: 100%;
    THIS IS THE dropdown menu.css
    @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: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 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: 0px;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: static;
    text-align: center;
    cursor: pointer;
    width: 132.8px;
    float: left;
    overflow: visible;
    visibility: visible;
    /* 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: 132.8px;
    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: 8.2em;
    /* 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: #333;
    color: #FFF;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-color: #FFF;
    padding: 0.5em 0.75em;
    color: #333;
    text-decoration: none;
    background-image: url(../_images/bar-top.png);
    background-repeat: no-repeat;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #003;
    background-image: url(../_images/bar-Bottom.png);
    /* 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
    color: #003;
    background-image: url(../_images/bar-Bottom.png);
    background-position: bottom;
    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(../_images/bar-topsub.png);
    background-repeat: no-repeat;
    background-position: right top;
    /* 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(../_images/bar-topsubhover.png);
    background-repeat: no-repeat;
    background-position: right bottom;
    /* 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(SpryMenuBarDownHover.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;

    Thanks a lot for that tip. It does improve it by a whole lot.. i c what my mistake was.. however, something is still off
    .. The Drop down menu is not behaving well...
    As you may c by the picture, the drop down menu now moves to the right. and is not because of the object to its left, i've modified that. Zinger Products Drop Down Menu also does the same.

  • Question: My spry menu bar is not displaying correctly in Dreamweaver

    Hello,
    I am  new to Dreamweaver CS5, so coding isn't my area of expertise. My problem with my spry menu bar is that it does not display the tabs on the menu bar correctly. When I try to apply new changes to the CSS of the horizontal menu bar, half of the tabs will change and the other half will not. Also, I am unable to drag and move the menu bar itself around, a function that I was once able to do before. At times, only one tab of the menu bar will display itself, without any of the other tabs as well.
    I have a hunch that my problems stem from some coding errors in the SpryMenuBarHorizontal.css, and possibly in the SpryMenuBar.js. On the CSS Styles panel, my SpryMenuBarHorizontal.CSS list reads as follows:
    I also have a hunch that something about this line-up is also incorrect, but I don't exactly know what the problem is.
    Here is what my coding for my SpryMenuBarHorizontal.css looks like right now:
    @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: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: auto;
        text-align: center;
    /* 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;
        text-align: left;
        cursor: pointer;
        width: 8em;
        float: left;
        left: 10;
        top: 10;
        height: 10;
    /* 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: 8.2em;
        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: 8.2em;
    /* 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;
        text-align: left;
    /* 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: #FFF;
        text-decoration: none;
        font-family: Futura;
        float: none;
    /* 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: #C00;
        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
        background-color: #C00;
        color: #FFF;
    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%;
        text-align: center;
    /* 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: block;
        f\loat: left;
        background: #FFF;
    And here is what my SpryMenuBar.js coding looks like right now too:
    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
    If anyone could possibly steer me on the right direction with this, I'd be very grateful! I've been struggling with this for about a month now and I feel like I may have only made the situation worse.
    I'm not sure if I have to keep making a new spry assets folder in my website or not or if I have to drag and drop the spry assets into the root folder. I have restarted my website over at least a dozen times by now. I have tried changing folders, dragging and dropping various spry assets folders everywhere and I have also uninstalled and reinstalled my copy of Dreamweaver CS5 in the hopes of getting my spry horizontal menu bar to act normal. I am completely new at Dreamweaver and I really, really need some help with this.
    Thanks!

    I haven't been able to get my site posted up yet. Here is a link to it anyway:andrearosales.com
    I will be working on connecting my files up to my server. At the moment, here are some screen shots of some messages that I am getting when I am saving my file.
    I'm not sure what to make of these messages. I tried to put a new spry horizontal menu bar on my main page, and when it appeared, it displayed as a spry vertical menu bar.
    Here is a picture of what it looks like:
    I"m going to refer to the links that were suggested to me though. I'm not sure if pictures of the code will help to solve my problem. I'm going to try again to connect my files to my server though.

  • Spry Menu Bar Colors and Pictures in Dreamweaver

    I'm having some trouble changing the color of the spry menu
    bars that I created in Dreamweaver. Whenever I preview them in a
    browser they show up as grey with black text. What I want them to
    show up as is blue with white text before the mouse goes over them
    and highlights them. When the mouse goes over them I want them to
    still be blue with white text and also my drop down menu options as
    well.
    What would be the fastest and easiest way to do this and if
    there is what css code is required for me to change? I'm unfamiliar
    with how css code works.
    I'm also having some problems with copying and pasting
    pictures and editing them too. what software can i download that is
    free that i can use to edit my pictures.
    I have the trial version mind you and I'm trying to get this
    finished as fast as I can.

    > What would be the fastest and easiest way to do this and
    if there is what
    > css
    > code is required for me to change?
    Bring up your page and adjust the CSS in the
    SpryMenuHorizontal.css or
    SpryMenuVertical.css page that is attached. All the color
    values are in
    there.
    >I'm unfamiliar with how css code works.
    You need to change this. Without a thorough working knowledge
    of HTML and
    CSS (at the very least), you will never have great success in
    either
    Dreamweaver or web design. I first learned web design using
    Notepad, typing
    every single tag, and I am soo grateful now that I had that
    solid coding
    experience .. without it, this program would be very hard to
    master.
    > I'm also having some problems with copying and pasting
    pictures and
    > editing
    > them too. what software can i download that is free that
    i can use to edit
    > my
    > pictures.
    Free? I'm not sure any more .. you can use either the 30 day
    trial of
    Fireworks or Photoshop (Fireworks would probably be easier to
    pick up) but
    if you're going to do a lot of this, you need to get some
    good tools and
    learn them well.
    Nancy Gill
    Adobe Community Expert
    Author: Dreamweaver 8 e-book for the DMX Zone
    Co-Author: Dreamweaver MX: Instant Troubleshooter (August,
    2003)
    Technical Editor: Dreamweaver CS3: The Missing Manual,
    DMX 2004: The Complete Reference, DMX 2004: A Beginner's
    Guide
    Mastering Macromedia Contribute
    Technical Reviewer: Dynamic Dreamweaver MX/DMX: Advanced PHP
    Web Development

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

  • Problem with .css for Spry menu

    Hi,
    I am having a problem with the Spry menu I have created and edited. All looks great in the Design view of Photoshop however under the Live view or opened using a browser the menu reverts to a list of hyperlinks!
    I have checked the .css link but when using Firefox CSS editor the CSS file for the menu is simply blank?
    Any suggestions would be great!
    Thanks,
    Ozan

    Your SpryMenuBarHorizontal.css needs to be within your SpryAssets folder, which is where it would have been put automatically when you inserted the SpryMenuBar. You can move it back in there using the Files Panel.
    Here is what the file structure needs to look like:
    SpryAssets
    SpryMenuBar.js
    SpryMenuBarHorizontal.css
    cssstyletemplate.css
    index.html (or whatever the name of your page is)
    Hierarchally, the top level of your root folder will show folders for SpryAssets and css and the html pages will be on the same level.
    The Spry assets themselves will be down a level IN the SpryAssets folder, as the styletemplate.css file will be down a level IN the css folder.
    In the head of the document, you will have
         <link rel="stylesheet" type="text/css" href="css/styletemplate.css" />
         <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"> </script>
         <link rel="stylesheet" type="text/css" href="SpryAssets/SpryMenuBarHorizontal.css" />
    At the end, remove the slash before Spry inside the imgDown and imgRight sections:
         <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    Compare these with your files and file structure and correct any small typos, and they should be correctly linked.
    Beth

Maybe you are looking for

  • Disk utility program crashing in lion 10.7.3

    The Disk Utilty application will not open, crashes on launch. Does anyone have a solution? Here is the crash report: Process:         Disk Utility [3190] Path:            /Applications/Utilities/Disk Utility.app/Contents/MacOS/Disk Utility Identifier

  • Reports 10g and Excel output

    Hi, We are getting the excel file generated out of report RDF by specifying the DESFORMAT=spreadsheet. This works fine and excel file opens when we run the report with proper output. However, when we try to 'save as' the excel file opened, the defaul

  • Implementing and Exposing a Web Dynpro as a Callable Object

    Hi All, I am new to guided procedures.I am trying to implement and expose webdynpro as a callable object in CE7.1.In the library i found the following steps In the Component Properties view of the component, open the Dependencies tab page and add the

  • HT1695 what do I do when my phone says no wi-fi but the wi-fi in my house is on?

    Today when I got home my wi-fi didnt seem to connect like it always does so I tried to do it myself. When I did it took almost 15minutes to load and after that I gave up so I turned my whole iphone off. After that I tried to connect again but this ti

  • What is an error 145, I get it when I try to open a website previously on.

    I was on a web site zipperstop.com yesterday, walked away from the computer for a couple hours. Now when I try to go to that website I bet a message "error 145" and the website crashed.