Spry in Iframe = trouble in IE

Hi,
I have encountered a problem or bug with a Spry form.
When the form lives in an iframe, the function
Spry.Widget.SelectionDescriptor.prototype.update throws an error
message "no access" when executing this line:
this.range =
this.element.ownerDocument.selection.createRange();
This only occurs in IE. Fx and Opera have no problems with
the form.
Any ideas how to fix this. The form has to live in an Iframe.
Kind regards
Morten

It appears spry and IE dont work well together at all. I am
also having a problem with a navagaiton menu. It wont work in IE
either. Wish I could help.

Similar Messages

  • Spry and Iframe event handlers

    Hi,
    I am trying to implement an ajax simulated file upload using
    spry and iframes. With Spry's power to attach event handlers and
    $$() notation for accessiblities is there a way that you can detect
    when an iframe is loaded using any of spry's utilities.?

    there is nothing other than the basic delay in web overlay.
    I suppose the only thing to do would be to create the whole article as HTML, but I'm sure that would be over the top, it would put me off!
    Alistair

  • Spry vs iframe

    Hi Everyone,
    I'm rather new to Spry, just 've been experiening it for some
    days.
    For the web app I am worikng on I need an interface to search
    user database and select one or more users for further processing
    as a part of a large form - preferably without page reload.
    First, I implemented it with multiple iframe-s and some
    javascript and it worked relatively fast, but was tricky and hard
    to maintain the code, so I decided to rewrite it with the
    easy-to-code-easy-to-maintain Spry. Then I experienced a vast
    decrease in terms of page loading speed.
    Does anyone have an explanation why?
    In the iframe-version I set up the search criteria with a
    form, post it to a php script, query database, format html table
    and return it to the browser into an iframe.
    In the Spry version, search criteria are posted to php and
    xml retreived using dataSet.setURL(...) and then spry:region
    recreated with dataSet.loadData(). (first, I used non-destructive
    filters but it seemed slower)
    The more rows the query retreives, the quicker the
    iframe-version is compared to spry. (the max rowcount I tried is
    approx.600)
    Also checking the memory and cpu usage, spry performs much
    worse (same as Tiestosolo wrote some days ago.)
    The only answer I can think of is the extra memory and cpu
    needed for the construction of the xml dom for the spry dataset.
    However, it would be a serious performance factor for spry limiting
    its usage only for relatively small (10-50 rows) datasets.
    I'm wandering if anyone can provide me with some info. Did I
    screw up something?
    Thanks a lot in advance.
    Miklos Kovacs
    Hungary

    The best way to make sure a submenu will be on top is to
    dynamicly create an Iframe for every opening submenu(and place this
    underneath the div. I'm not sure that it will cover an SWF.
    I do not have any knowledge of the spry menu so I can not
    give any spry specific help!

  • Spry overlays iframe

    Is there a way to keep the spry menu on top of an iframe of
    swf?

    The best way to make sure a submenu will be on top is to
    dynamicly create an Iframe for every opening submenu(and place this
    underneath the div. I'm not sure that it will cover an SWF.
    I do not have any knowledge of the spry menu so I can not
    give any spry specific help!

  • Spry Menu & iframes

    I am trying to debug a page that includes both a Spry menu
    and an iframe:
    http://gid.cdiabu.com/ptwinter06/mroulstone/resume.html
    When you navigate to this resume.html page you should be able
    to hover over the "portfolio" navigation link and see a sub-menu
    dropdown. However, no dropdown appears on this page and this page
    only. The only difference I see on this page is that it is the only
    one that includes an iframe. Could this iframe somehow be
    interfering with the dropdown list?
    A fresh pair of eyes would be appreciated. What else am I not
    seeing?
    Thanks,
    Gene
    resume.html

    On Sat, 8 Dec 2007 16:55:21 +0000 (UTC), "babong"
    <[email protected]> wrote:
    > When you navigate to this resume.html page you should be
    able to hover over
    >the "portfolio" navigation link and see a sub-menu
    dropdown. However, no
    >dropdown appears on this page and this page only. The
    only difference I see on
    >this page is that it is the only one that includes an
    iframe. Could this
    >iframe somehow be interfering with the dropdown list?
    While there appears to be some other problem with it as well,
    your
    assumption is correct. The menu cannot appear over the space
    reserved by
    the browser to display another page in the iframe.
    Gary

  • Spry accordion subpage troubles

    Hello all,
    I used DW CS4 to set up a spry accordion for my site (www.apposite.us) navigation menu.  I was able to change some of its behaviors and appearance and am mostly satisfied, but I have two lasting issues:
    1. I want the 'Home' tab to share the style and behavior of the rest of the accordion, but since it does not have any content, DW seems to interpret it as 'broken' and refuses to return the index page upon selection.  I tried to fix the issue by defining an empty content panel, which fixes the 'broken' issue, but the change messes up spacing relative to the rest of the menu.
    2.  I want a particular panel to remain open upon selection of its content (right now, the panel reverts to collapsed when a content page is opened).  I found a solution that involves working with several templates, but I would like to avoid this if at all possible.
    Any suggestions on either improving the function of this accordion or setting up the menu more effectively using a different method would be greatly appreciated.
    Jane

    Sorry, my followup message should read:
    Hi Gramps,
    Your suggestion for part one of my problem worked (thank you!), but I am still having problems implementing part two.
    As it is currently constructed, all pages are set up with the same template, which includes
    var Accordion1 = new Spry.Widget.Accordion("MenuLabels", { useFixedPanelHeights: false });
    in its code.  Is there a way to make any selected content return its parent panel?  Or is there a way to make an editable code region within the template (I have tried but not succeeded in doing this)?  If the code you suggested
    var Accordion1 = new Spry.Widget.Accordion("MenuLabels", { defaultPanel: 2, useFixedPanelHeights: false });
    must be added to each linked content page, how do I achieve this without divorcing it from the template?
    Thanks again,
    Jane

  • Spry Tabbed Pannel Trouble

    Sorry for the newbie question, but I'm really in a bind right
    now. I am using a spry tabbed pannel on my company's website that
    I'm in the process of designing, and yesterday it worked perfectly.
    At the end of the day yesterday, I did something and I'm not sure
    what did it exactly, and now when I test it in the browser, I click
    on one tab it shows me the contents of the wrong tab.
    To try and paint a picture, I work for a small communications
    company/ISP, so I have tabs for "home" "internet" "telus mobility"
    "bell expressvu" "products" "about us".
    Everything works left of "telus mobility". Once I click on
    the telus one, it comes up blank. When I click on "bell expressvu"
    the telus page comes up. When I click on "products" it comes up
    blank. When I click on "About us" the telus page comes up.
    I've tried making a new page and copying and pasting the
    contents of the screwed up tab, but that just came up with the same
    problems, so I'm thinking the problem is with the contents, and not
    necessarily the CSS coding, but then again, I'm a total newbie and
    I could be way off base. If anyone has any ideas I'm totally open
    to hearing them. If you want to look at the page, I'd be happy to
    send you the root folder.
    I guess another option for me would be to just write the
    whole page out again, which I guess wouldn't be the end of the
    world, and might be faster. I was just hoping someone might have
    had this problem before and knows what to do.
    Thanks so much in advance.
    -caleb

    Post a link to the page, please.
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "calskin" <[email protected]> wrote in
    message
    news:fp4ive$b0i$[email protected]..
    > Sorry for the newbie question, but I'm really in a bind
    right now. I am
    > using
    > a spry tabbed pannel on my company's website that I'm in
    the process of
    > designing, and yesterday it worked perfectly. At the end
    of the day
    > yesterday,
    > I did something and I'm not sure what did it exactly,
    and now when I test
    > it in
    > the browser, I click on one tab it shows me the contents
    of the wrong tab.
    >
    > To try and paint a picture, I work for a small
    communications company/ISP,
    > so
    > I have tabs for "home" "internet" "telus mobility" "bell
    expressvu"
    > "products"
    > "about us".
    >
    > Everything works left of "telus mobility". Once I click
    on the telus one,
    > it
    > comes up blank. When I click on "bell expressvu" the
    telus page comes up.
    > When I click on "products" it comes up blank. When I
    click on "About us"
    > the
    > telus page comes up.
    >
    > I've tried making a new page and copying and pasting the
    contents of the
    > screwed up tab, but that just came up with the same
    problems, so I'm
    > thinking
    > the problem is with the contents, and not necessarily
    the CSS coding, but
    > then
    > again, I'm a total newbie and I could be way off base.
    If anyone has any
    > ideas
    > I'm totally open to hearing them. If you want to look at
    the page, I'd be
    > happy to send you the root folder.
    >
    > I guess another option for me would be to just write the
    whole page out
    > again,
    > which I guess wouldn't be the end of the world, and
    might be faster. I
    > was
    > just hoping someone might have had this problem before
    and knows what to
    > do.
    >
    > Thanks so much in advance.
    >
    > -caleb
    >

  • Spry Menu Bar troubles

    I am trying to vertical menus that may have up to 2 levels of
    popups. At first the submenus were invisible until I changed a CSS
    setting in ul.verticalmenubar a Positioning setting from -1000 to
    0. I don't know how it was set in the first place. Now the submenus
    are always on the screen, overlaying the content beneath them. How
    do I get them to only appear on a rollover or click on the menu
    item. There seems to be no code automatically inserted to do this.
    I have been trying to get Spry to work for several days, and
    can never get the submenus to work correctly. Do you have any ideas
    on what is wrong? Is Spry still buggy? I'm working with IE.

    When you download the installer it runs another application
    which installs the 1.6 addon into DW CS3. It updates all of your
    scripts to 1.6 and puts your old SpryCSS into another Spry folder
    in your site (which can be deleted).
    The 1.6 update is supposed to help with some of the early
    issues with some of the newer browsers (most notably IE). If you
    are still having issues it might be best if you can just post a
    link to this page (so if you have not uploaded it yet, do so). I
    don't know why the submenus wouldn't show up on rollover. They
    shouldn't be having this problem so it is an issue with the CSS.
    If you look back at my first post there is a link to a file
    called "SpryMenuBarVertical.css". Click on that link and view the
    CSS file in your browser. Compare that to what you have in your CSS
    document in the Spry Assets folder. See if they match up or if
    something is different (ignoring all colors and background images
    that you may have changed). That would be the only other option to
    posting a link to your page would be for you to compare those
    documents.

  • Iframe trouble

    When I create the page in iweb it looks fine until I add the iframe in html code.
    This is how it looks prior to adding the frame:
    http://web.mac.com/buvin/iWeb/Frase%20%26%20Zeits%20Yachts%20International/exoti ccars.html
    After I enter the html code my buttons and logo drop down from the top of the page... I don't know why this is hapening.
    http://fraserzyachts.com/exoticcars.html
    Any help would be greatly appreciated. Thank you...
    MacBook Pro 17   Mac OS X (10.4.8)  

    Jeffrey,
    You'll find in your page, where the text box which holds the iframe is position at 90px from the top, in relative position (my guess here is the header graphic position)
    div class="graphicgeneric_body_textbox_styledefault" style="margin-left: 13px; margin-top: 90px; position: relative; width: 800px; z-index: 1; "
    Change that to 0px will fix the problem:
    div class="graphicgeneric_body_textbox_styledefault" style="margin-left: 13px; margin-top: 0px; position: relative; width: 800px; z-index: 1; "

  • Spry tabbed panel trouble

    Here's the link:
    http://www.progressity.com/NewEdVentureGroup/
    I've uploaded the entire site but for some reason the css for
    the tabbed panel loses its link (I guess). Everything works fine
    when viewed locally.

    The path to the SpryAssets folder seems to be bad. It is
    pointing up 2 levels when there is only one level about where that
    page is (ie: ../../) when it looks like it should be
    SpryAssets/SpryTabbedPanels.css because the folder is below the
    NewEdVenture folder, not above it as the path suggests.

  • Spry Menu, IE troubles

    does anyone know how to fix this?
    http://www.ov-ds.com/penn_index.html
    please view in IE to see the prob. works fine in other
    browsers

    I'm not seein any markup for a vertical menu in that page?
    --== Kin ==--

  • JQuery Cycle 2 Image Slideshow (Works (cycles) in Explorer, but not in Safari or Chrome??

    I am novice designer. I copied code for Cycle2 into my head (declaration or initializer?) and body (image source) of HTML document. The slider cycles through pictures in Explorer, but not in Safari or Crome. Any help, suggestions, alternatives would be appreciated. Thank you.
    I have tried
    Spry Content Slideshow- trouble being responsive when resized.
    FlexSlider2.2- trouble with image height/viewport sizing to big (kinda had workaround), but had trouble with getting HTML text and image together on one slide.
    WOWSlider- could not get rid of the gutter/margins surrounding the slider.
    Cycle2-won't work in all browsers (for me)
    Here is my code (on otherwise empty HTML and CSS pages) for Cycle 2
    <!doctype html>
    <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
    <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
    <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
    <!--[if gt IE 8]><!-->
    <html class="">
    <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>HTML5 document with Cycle2</title>
    <!--Latest jQuery Core Library-->
    <script src="http://code.jquery.com/jquery-latest.min.js">
    </script>
    <!--Cycle2 Plugin Script-->
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20130409/jquery.cycle2.min.js"></script>
    <style>
    .cycle-slideshow, .cycle-slideshow * {
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin:0 auto;
    width:45%; /**adjust width as required**/
    .cycle-slideshow img {width: 100%;}
    </style>
    <title>Untitled Document</title>
    <link href="css/boilerplate.css" rel="stylesheet" type="text/css">
    <link href="css/stylesheet.css" rel="stylesheet" type="text/css">
    <!--
    To learn more about the conditional comments around the html tags at the top of the file:
    paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
    Do the following if you're using your customized build of modernizr (http://www.modernizr.com/):
    * insert the link to your js here
    * remove the link below to the html5shiv
    * add the "no-js" class to the html tags at the top
    * you can also remove the link to respond.min.js if you included the MQ Polyfill in your modernizr build
    -->
    <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script src="css/respond.min.js"></script>
    </head>
    <body>
    <div class="gridContainer clearfix">
      <div id="LayoutDiv1">Use Insert Panel for additional Fluid Grid Layout Div tags. Note: All Layout Div tags must be inserted directly inside the "gridContainer" div tag. Nested Layout Div tags are not currently supported. </div>
      <div id="top">This is the content for Layout Div Tag "top"</div>
      <div id="header">This is the content for Layout Div Tag "header"</div>
      <div id="navigation">This is the content for Layout Div Tag "navigation"</div>
      <div id="slider"><h1><a href="http://www.malsup.com/jquery/cycle2/">jQuery Cycle 2</a> Responsive Slideshow</h1>
    <!--begin slideshow-->
    <div class="cycle-slideshow"
        data-cycle-pause-on-hover="true"
        data-cycle-speed="700"
    >
    <!--your images go here-->
    <img src="http://malsup.github.com/images/beach1.jpg" data-cycle-title="beach1">
    <img src="http://malsup.github.com/images/beach2.jpg" data-cycle-title="beach2">
    <img src="http://malsup.github.com/images/beach3.jpg" data-cycle-title="beach3">
    <img src="http://malsup.github.com/images/beach4.jpg" data-cycle-title="beach4">
    <img src="http://malsup.github.com/images/beach9.jpg" data-cycle-title="beach9">
    <!--end slideshow-->
    </div></div>
      <div id="content1">This is the content for Layout Div Tag "content1"</div>
    </div>
    </body>
    </html>

    Resize/re-scale & optimize all images for the web in your graphics editor before you insert them into your web pages.  Saves bandwidth and reduces page load.
    Cycle2 is a responsive slideshow.  If you want all images to remain 400px and not responsive to layout,  you'll need to modify the CSS code a little.
    Details on using Previous & Next links are in the documentation.
    http://jquery.malsup.com/cycle2/demo/prevnext.php
    Nancy O.

  • CSS practical question

    Hello,
    I have to code this web site:
    http://azubel.com/donomaq/
    (if you click on the screen you can see two internal pagese too)
    I would like to use pure CSS.
    1.- Based on the design, is that a wise way to go? Or should
    I use tables?
    2.- How would you manage the overlapping "Ground
    Vehicles"... etc. over the main image?
    3.- What about the thin lines all over the design.
    Thanks a lot
    Roby

    > should I use the Spry menu that comes with DW or this
    one:
    >
    http://www.dynamicdrive.com/style/csslibrary/item/jquery_multi_level_css_menu_ho
    > rizontal_blue/
    Personally, I wouldn't use either. I'd grab PopMenuMagic2
    from PVII -
    http://www.projectseven.com/,
    and use that. It's something that I use on
    90% of the sites I build. I think it's about the best I've
    seen....
    > Does Spry have any troubles with browsers? do I need to
    have something
    > turned
    > on?
    No.
    > I'm asking because IE just blocked it because of a
    possible harmful
    > opperation.
    http://www.projectseven.com/support/answers.asp?id=153
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "Roby_" <[email protected]> wrote in message
    news:gorg7l$2l5$[email protected]..
    > Oh, one more thing.
    > About the nav bar.
    > should I use the Spry menu that comes with DW or this
    one:
    >
    http://www.dynamicdrive.com/style/csslibrary/item/jquery_multi_level_css_menu_ho
    > rizontal_blue/
    >
    > Does Spry have any troubles with browsers? do I need to
    have something
    > turned
    > on? I'm asking because IE just blocked it because of a
    possible harmful
    > opperation.
    >
    > Thanks
    >
    > Roby
    >
    >

  • I have a perplexing problem, in firefox the iframe in the spry tabbed panel doesn't work any ideas?

    I have made a page with spry tabbed panels, i have embedded an iframe in the content section of the second tab, this works perfectly well with Google, IE, Safari, Opera etc but just doesnt work in Firefox.
    If I make the tab panel containing the iframe the Default tab then it works, i just cant figure out why,
    By the way new to all this so be gentle please
    <div id="main_column">
         <div class="section_w500">
            <h2>North Bali Listings</h2>
            <div id="TabbedPanels1" class="TabbedPanels">
              <ul class="TabbedPanelsTabGroup">
                <li class="TabbedPanelsTab" tabindex="0">About North Bali</li>
                <li class="TabbedPanelsTab" tabindex="0">Land</li>   <<<<< This is the tab where the iframe is embedded in the content panel>>>>>
                <li class="TabbedPanelsTab" tabindex="0">Houses / Villas /Apartments / Rooms</li>
                <li class="TabbedPanelsTab" tabindex="0">Commercial</li>
    </ul>
              <div class="TabbedPanelsContentGroup">
                <div class="TabbedPanelsContent">A property analyst recently said that limited land availability in the southern parts of Bali, especially  in and around the Badung and Denpasar areas, has driven investors northward, in our opinion   at this time it is an ideal opportunity to  acquire property still at very sensible prices in this area, be it for investment or as a place of residence.. <br />
                  <p> <img src="../../../Images/Bali Scenes General/panoramic-views.jpg" alt="views" width="183" height="140" align="left" />Over the last few of years, investors have been targeting the northern area,  principally along the coastline ,  with its variety of pristine black sandy beaches, pebble beaches and rugged coastline, offering a variety of activities; scuba diving, snorkelling,  water sports, fishing, sailing. trekking  gives this area the potential to be world-class tourist destination. Research has shown that  property prices are set to rise above the average due to increased infrastructure development, and the planned opening of a new International Airport in the North shows the Bali Government's commitment to the develop this area as a future tourist destination.<br />
                    <br />
                    The Northern part of Bali  is also an excellent base for exploration further afield, close to the main portal for trips to other parts of Indonesia. <br />
                  Although it is largely undeveloped there is a wide range of properties and land with beach front to panoramic rice paddy views still to be found at good value for money. </p>
                  <table width="100%">
                    <tr>
                      <td align="left" valign="top"><div class="AreasOfBaliHighlight" style="color: #60C; font-weight: bolder;">This is an ideal time to consider your dream property  in this area; be it for investment, development or private use.</div></td>
                    </tr>
                  </table>
                  <p> The main tourist area in the North is arguably <span style="color: #F00">Lovina</span>, with property prices reflecting this especially beach front or with panoramic views so expect to see prices a little bit more expensive in and around this area. However inland prices are still very reasonable.<br />
                    <br />
                    <img src="../../../Images/Bali Scenes General/Traditional-lifestyle.gif" alt="village life" width="188" height="137" hspace="2" align="right" />Other  areas to be found in the North going towards <span style="color: #F00">Gillimanuk</span> the main portal for the ferry to and from Java; include: <span style="color: #F00">Pemuteran</span> popular diving area, <span style="color: #F00">Menjangan</span> <span style="color: #F00">Island</span>, a popular diving and nature reserve;  are also beginning to attract investors, resulting in  prices  rising.<br />
                    The area of the North of Bali travelling East from <span style="color: #F00">Lovina</span> towards the eastern part of Bali is quieter and more rural, with stunning coastline and secluded traditional village life, here life slows down, people are very friendly and happy to integrate with &quot;Bule (Foreigner), this life style is definitely completely different to the hustle and bustle of the South of Bali, perfect for future development and peaceful retirement, and with the development of the new <span style="color: #F00">International Airport</span> in this area, about 1/2 way between <span style="color: #F00">Singaraja</span> and <span style="color: #F00">Almpura</span> in the East, which makes this area an ideal investment opportunity as property and land prices are set to grow in this part of North Bali faster than other areas.<br />
                    <br />
                    <img src="../../../Images/Bali Scenes General/img_bali_1.jpg" alt="Quiet Lanes" width="189" height="124" hspace="2" align="left" />It has to be said that facilities for schooling, medical services and shopping are not as good as in the South or around Ubud area, which have higher concentrations of  established ex pat communities, and better facilities  also the job opportunities are not anywhere near as plentiful as in the South or Ubud areas, which limits the lifestyle for many people looking to settle in Bali, careful consideration has to be given if your intention is for a place for you to reside, and it is possibly an area for consideration as an investment opportunity, or for a development of hotel or villa resort, or as a second retirement home. </p>
                  <p>There are of course facilities for all the usual services and plenty of job opportunities, and a small but growing ex-pat community, especially in and around <span style="color: #F00">Lovina</span> and <span style="color: #F00">Singaraja</span> just not as many as in the other popular areas for ex pat's. </p>
                </div>
                <div class="TabbedPanelsContent">
                  <p> </p>
                  <table width="100%" border="0">
                    <tr>
                      <td valign="top"><h7 style="color: #C03"><span style="font-weight: bold"><span style="font-size: 12px; color: #FFF;">Property Code BSP 00130101</span><span style="font-size: 16px"> </span>SAMBIRENTENG - North East Bali 7,300 meters (</span></h7>
                        <span style="font-weight: bold; color: #B90033;">73 ARE) Beach front flat wooded land for Sale/ Rent</span></td>
                      <td><span class="button_01"><a href="#" onclick="MM_openBrWindow('North Bali/Gold Package Listings/BSP-00130101/Sambirenteng  Property Location Map.html',width=750,height=200')">Location Map</a></span></td>
                    </tr>
                    <tr>
                      <td width="77%" valign="top"><p>A golden opportunity to acquire a prime plot of beach front land in the North East of Bali in an area that enjoys newly awarded &quot;Tourism Status&quot;  ideal for the development of a small hotel or villa complex, easy access to many popular tourist spots already developing in the North.</p>
                        <p> A 3 meter wide sealed road gives acces to the whole length of this prime plot of land: Electric (PLN) Water (PDAM) Telephone &amp; Internet close to hand and readilly available</p></td>
                      <td width="23%"><a href="Carousel Sambirneteng Listings.html target="_parent"></a><iframe src="Carousel Sambirneteng Listings.html" allowtransparency="yes" frameborder="no" height="111" width="156" scrolling="No" align="middle" marginheight="0"></iframe></td>
                    </tr>
                    <tr>
                      <td valign="top">Purchase price<span style="color: #33C; font-weight: bold;"> 12,500,000,000 Rp</span><br />
                        Rental Price (25 years) <span style="font-weight: bold">9,450,000,000</span> <span style="font-weight: bold">Rp</span> <span style="color: #FFF"> (<span style="font-weight: bold; color: #3333D0;"> 5,200,000 Rp</span><span style="color: #3933D5"> </span> per are per year )<br />
                          Min Rental Period 25 Years, extendable to to a max of 75 years
                          (with full &quot;Right Of Use&quot; issued by owner)</span></td>
                      <td valign="top"><p class="button_01"><a href="../Gold Package Listings/BSP-00130101/BSP00130101 Details.html">Find out more</a></p>
                        <br />
                        <span class="button_01"><a href="../Gold Package Listings/BSP-00130101/BSP00130101_Enquiry Form.html" target="_parent">Make Enquiry</a></span></td>
                    </tr>
                  </table>
                  <p><br />
                  </p>
                  <hr width="100%" noshade="noshade" />
                  <p> </p>
                </div>
    <div class="TabbedPanelsContent">Sorry we don't have any listings under this catagory at the moment,,, Check back later or register with us, and we will send you regular updates of any new properties we list.<iframe src="Carousel Sambirneteng Listings.html" allowtransparency="yes" frameborder="no" height="111" width="156" scrolling="No" align="middle" marginheight="0"></iframe></div>
                <div class="TabbedPanelsContent">Sorry we don't have any listings under this catagory at the moment,,, Check back later or register with us, and we will send you regular updates of any new properties we list.</div>
    </div>
            </div>
            <p> </p>
          <p>
            <h7 style="color: #C03"></h7>
          </p>
    <h2></h2><!-- this stays empty to put dotted line under listings block -->
         </div>
         <div class="cleaner"></div>
        </div> <!-- end of main column -->

    Could you share a link to the page?
    Seeing it in context and in our browsers is much easier to debug.
    If not, make sure to run the validator here The W3C Markup Validation Service and clear out any problems. HTML errors, especially structural ones, will cause all kinds of display problems in various browsers/versions/platforms.

  • Trouble with Spry Menu Bar Not Opening on Hover

    I have two Spry Menu Bars on this one page. They were both working fine. Now the menu bar on the top right is not opening on rollover. I have uploaded the Spry .JS and .CSSfiles to the server.Could it be that I added 2 to the names of the CSS styles, but not all of them? I just tested them all with 2 after the style name, and it didn't fix it.
    I also noticed that the ability to edit these two navigation bars using the Property Inspector went away. I can't seem to click on them to edit. Now I edit them through the code only.
    Rebuild it on another page, and paste in the code?
    Suggestions?
    ALso, getting an error message on line 2 of HTML below, which I don't remember editing.
    I will paste the template page HTML, then the CSS, then the Javascript Spry file for Menu Bar Horizontal. I did not edit the JS file at all.
    Link to the uploaded files: http://www.sproulcreative.com/filetest/panin_website/
    Thanks for any help you can offer.
    D
    HTML for template page:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Press Reviews of Paninos Italian Restaurant Food in three Colorado Locations</title>
    <!-- TemplateEndEditable -->
    <link href="../styles_paninositalianrestaurant.css" rel="stylesheet" type="text/css" />
    <script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="../SpryAssets/SpryMenuBar_topnav.js" type="text/javascript"></script>
    <link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <link href="../SpryAssets/SpryMenuBarHorizontal_topnav.css" rel="stylesheet" type="text/css" />
    <!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable --><!-- TemplateParam name="LinksSidebar" type="boolean" value="true" -->
    </head>
    <body>
    <div id="wrapper">
    <a href="#skiptomaincontent">
         <img src="../images/spacer.gif" alt="Skip to main page content" name="spacer" width="1"
    height="1" class="invisible" id="spacer">   </a><!--ANCHOR FOR SCREEN READERS-->
    <!--START TOP NAV DIV-->
    <div id="topnav">
    <!--START TWITTER/FACEBOOK MENU BAR -->
    <script type="text/javascript">
    <!--
    var MenuBar2 = new Spry.Widget.MenuBar("twittermenu", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>
    <ul id="twittermenu" class="MenuBarHorizontal2">
          <li><a href="../paninos_local_italian_restaurant_fort_collins_colorado_springs_minnesota.html">H ome</a></li>
          <li><a href="../reviews_italian_restaurant_food.html">Reviews</a></li>
          <li><a href="../history_of_paninos_local_italian_restaurant_coloradosprings_fortcollins_minnesot a.html">History</a></li>
          <li><a class="MenuBarItemSubmenu2" href="#">Twitter</a>
                      <ul>
                            <li><a href="http://twitter.com/Paninosfc">Follow Fort Collins, CO, Paninos</a></li>
                            <li><a href="http://twitter.com/paninosmn">Follow Minnesota Paninos</a></li>
                      </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu2">Facebook</a>
                <ul>
                      <li><a href="http://www.facebook.com/search/?q=Paninos&init=quick#/pages/North-Oaks-MN/Paninos/13234142 7180?v=wall&ref=search">Minnesota Twin Cities Four</a></li>
                </ul>
                </li>
    </ul>
    <!--END TWITTER/FACEBOOK MENU BAR-->
    </div>
    <!--ENDS TOP NAV DIV-->
    <div id="pagebg">
    <div id="centralpageborder"><!--FOR BORDER TRIM & BG color-->
    <!--START OF HEADERBOX-->
    <div id="headerbox">
          <div align="left">
                <img src="../images/web_logo_paninos_final.png" alt="Paninos Italian Restaurant Logo (black text with a tomato for the letter O), Your family's Italian restaurant for over 35 years, locally owned and operated." width="215" height="118" class="paddingbottom" />
    <!--START OF MAIN FOUR NAVIGATION -->
    <ul id="MainFourNav" class="MenuBarHorizontal">
          <li><a href="#" class="MenuBarItemSubmenu"><img src="../images/img_mainnav_locations_contact.png" alt="Paninos Italian Restaurant Locations and Contact Information: Colorado Springs, Fort Collins, Minnesota" name="locationscontactbutton" width="167" height="24" border="0" id="locationscontactbutton" /></a>                 <ul>
                         <li><a href="../contact_info_italian_restaurant_fort_collins_colorado_paninos.html">Fort Collins, Colorado, by CSU</a></li>
                         <li><a href="../contact_info_italian_restaurant_colorado_springs_downtown_colorado_paninos.html" >Colorado Springs Downtown: Tejon St. by Colorado College</a></li>
    <li><a href="../contact_info_italian_restaurant_colorado_springs_8th_street_colorado_paninos.htm l">Colorado Springs: South Eighth St.</a></li>
                      <li><a href="http://paninos.com/minnesota/">Minnesota website</a></li>
                      </ul></li>
          <li><a href="#" class="MenuBarItemSubmenu"><img src="../images/img_main4nav_download_menus.png" alt="Download Italian Restaurant Menus in PDF format for restaurants in Fort Collins, Colorado; Colorado Springs, Colorado; and Minnesota" name="menudownloadbutton" width="142" height="24" border="0" id="menudownloadbutton" /></a>
                <ul>
                      <li><a href="#"><em>Please pick your favorite Paninos:</em></a></li>
                      <li><a href="../online_menus_local_italian_food/Paninos_Menu_ColoradoSprings_Downtown.pdf">Color ado Springs Downtown: Tejon St. by Colorado College</a></li>
    <li><a href="../online_menus_local_italian_food/Paninos_Menu_ColoradoSprings_Eighth_Street.pdf"> Colorado Springs: South Eighth St.</a></li>
                      <li><a href="../online_menus_local_italian_food/Paninos_Menu_Fort_Collins_Colorado.pdf">Fort Collins, Colorado, by CSU</a></li>
                      <li><a href="http://paninos.com/minnesota/">Minnesota (go to website)</a></li>
                </ul>
          </li>
          <li><a href="../photo_gallery_pasta_dishes_pizza_italian_food.html"><img src="../images/img_main4nav_photo_gallery.png" alt="Photo Gallery of Local Italian Food including pizza and pasta" name="photogallery" width="56" height="24" border="0" id="photogallery" /></a> </li>
          <li><a href="../pizza_coupons_and_special_deals_italian_food.html"><img src="../images/img_main4nav_specials.png" alt="Pizza Coupons and Specials" name="pizzacouponsandspecials" width="71" height="24" border="0" id="pizzacouponsandspecials" /></a> </li>
    </ul>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MainFourNav", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>           
                <!-- TemplateBeginEditable name="HeaderPhotos" -->
                <p class="headerphotos"><img src="../images/imgheader_lasagna_beef_hot_cheesey_coloradosprings_fortcollins_italian_res taurant.png" width="263" height="133" /><img src="../images/imgheader_spinach_salad_with_chicken.png" width="263" height="133" /><img src="../images/imgheader_big-t-pizza2.png" width="263" height="133" /></p>
                <!-- TemplateEndEditable --></div>
    </div><!--ENDS HEADERBOX DIV-->
    <div id="bodybox"><!--BOX AROUND MAIN PAGE TEXT, FOR WHOLE PAGE BELOW HEADER AREA-->
    <div id="pagetitle"><!-- TemplateBeginEditable name="MainPageHeader" --><img src="../images/img_title_press_reviews_italian_restaurant.png" width="307" height="38" /><!-- TemplateEndEditable --></div><!--ENDS PAGE TITLE-->
    <div id="innerbdybox"><!--WRAPS ALL MAIN CONTENT BELOW BODYBOX TITLE, all 3 columns -->
    <div id="content"><!--WRAPS MAINTEXT AND PHOTO SIDEBAR COLUMNS-->
    <div id="maintext"><!--MAINTEXT OR BODY CONTENT OF P-->
    <!-- TemplateBeginEditable name="BodyTextSection" -->
    <a name="skiptomaincontent" id="skiptomaincontent"></a><!--ANCHOR FOR SCREENREADERS-->
    <h1>A Tradition Food And Sports: <br />
                            CC &amp; Panino’s Love of Hockey Runs From Colorado to Minnesota</h1>
          <h4>Byline: By Jim Bainbridge, The Gazette</h4>
          <p>No Colorado Springs business has had a deeper bond with the Colorado College hockey program during the past three decades than Panino’s Restaurant, a connection seen on its walls, in its clientele and in its bloodlines.<br />
                Panino’s has been tied to the school’s hockey program since the restaurant was bought in 1974 by former CC All-America hockey player Tony Frasca. It’s still the place to be on game day a generation later with his son Mike running things. <a href="http://daily.gazette.com/Repository/ml.asp?Ref=VGhlR2F6ZXR0ZS8yMDA1LzAzLzI5I0FyMDMzMDI=&Mo de=HTML&Locale=english-skin-custom"><span class="smalltext">Click here to view entire article.</span></a><br />
    <span class="smalltext">(Reprinted with permission of The Gazette)</span></p>
          <!-- TemplateEndEditable --> </div>
    <!--ENDS MAINTEXT DIV-->
          <div id="photosidebar">
                <!--STARTS PHOTO SIDEBAR DIV-->
                <!-- TemplateBeginEditable name="PhotoSidebar" --><img src="../images/img_waiter1_pizza_lasagna.png" alt="Happy waiter serving Pizza and Lasagna" width="190" height="158" /> <br />
                <img src="../images/img_panino_italian_grinder_sandwich.png" alt="Grinder Hot Italian Sandwich called a Panino" width="190" height="158" /><!-- TemplateEndEditable --></div>
          <!--ENDS PHOTOSIDEBAR DIV-->
    </div><!--ENDS #CONTENT DIV THAT ENCLOSES 2 COLUMNS- MAINTEXT AND PHOTOSIDEBAR-->
          <!-- TemplateBeginIf cond="_document['LinksSidebar']" --><!-- TemplateBeginEditable name="EditRegion3" -->
    <div id="linkssidebar"><!--START LEFT LINKSSIDEBAR DIV--> 
            <p>The Gazette<br />
                The Coloradoan<br />
                The North Forty News<br />
                Colorado Springs Times</p>
    </div><!--ENDS LINKSSIDEBAR DIV-->
    <!-- TemplateEndEditable --><!-- TemplateEndIf -->
    </div><!--ENDS INNERBODYBOX DIV THAT WRAPS ALL 3 COLUMNS BELOW THE HEADER -->
    <div id="footer"> </div><!--CLEARS CONTENT BEFORE LOWER CONTENT BORDER-->
    <br />
    <br />
    </div> <!--****ENDS BODYBOX DIV THAT ENCLOSES PAGE HEADER BELOW "HEADER" AREA,INNERBODYBOX (FOR ALL 3 COLUMNS OF CONTENT), and FOOTER DIV (TO CLEAR CONTENT) . MOVING THIS AFER THE LINKKSIDEBAR SEEMED TO MAKE IT ALGIN CORRECTLY. PUTTNG AFTER THE PHOTOSIDEBAR MADE THE MAINTEXT HAVE SCROLL BAR-->
    </div><!--ENDS CENTRALPAGEBORDER DIV-->
    </div><!--ENDS PAGEBG DIV-->
    </div><!--ENDS WRAPPER TO MAKE PAGE LEFT JUSTIFY -->
    </body>
    </html>
    CSS for Spry Menu Bar:
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - Revision: Spry Preview Release 1.4 */
    /* 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.MenuBarHorizontal2
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: auto;
        /*margin-top: -10px; */
        margin-right: 0;
        margin-bottom: 0;
        margin-left: 0px;
        padding-top: 0;
        padding-bottom: 0;
    /* 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.MenuBarHorizontal2 li
        list-style-type: none;
        font-size: 95%;
        position: relative;
        text-align: left;
        cursor: pointer;
        float: left;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
    /* 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.MenuBarHorizontal2 ul
        margin: 0;
        padding: 0;
        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.MenuBarHorizontal2 ul.MenuBarSubmenuVisible
        left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal2 ul li
        width: 8.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal2 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.MenuBarHorizontal2 ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal2 ul
        border: 1px solid #9E2532;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal2 a
        display: block;
        cursor: pointer;
        padding: 0.5em 0.75em;
        color: #F3E8CC;
        text-decoration: none;
        background-color: #663300;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal2 a:hover, ul.MenuBarHorizontal2 a:focus
        color: #FFF;
        background-color: #663300;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal2 a.MenuBarItemHover, ul.MenuBarHorizontal2 a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal2 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.MenuBarHorizontal2 a.MenuBarItemSubmenu2
        background-image: url(SpryMenuBarDown.gif);
        background-repeat: no-repeat;
        background-position: 100% 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.MenuBarHorizontal2 ul a.MenuBarItemSubmenu2
        background-image: url(SpryMenuBarRight.gif);
        background-repeat: no-repeat;
        background-position: 100% 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.MenuBarHorizontal2 a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarDownHover.gif);
        background-repeat: no-repeat;
        background-position: 100% 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.MenuBarHorizontal2 ul a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarRightHover.gif);
        background-repeat: no-repeat;
        background-position: 100% 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.MenuBarHorizontal2 iframe
        position: absolute;
        z-index: 1010;
    /* 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.MenuBarHorizontal2 li.MenuBarItemIE
            display: inline;
            f\loat: left;
            background: #FFF;
    JAVASCRIPT FILE FOR MENU BAR HORIZONTAL:
    /* SpryMenuBar.js - Revision: Spry Preview Release 1.4 */
    // 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.
    var Spry;
    if(!Spry)
        Spry = {};
    if(!Spry.Widget)
        Spry.Widget = {};
    // 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;
        var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');
        if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))
            // bail on older unsupported browsers
            return;
        // load hover images now
        if(opts)
            for(var k in opts)
                var rollover = new Image;
                rollover.src = opts[k];
        if(this.element)
            this.currMenu = this.element;
            var items = this.element.getElementsByTagName('li');
            for(var i=0; i<items.length; i++)
                this.initialize(items[i], element, isie);
                if(isie)
                    this.addClassName(items[i], "MenuBarItemIE");
                    items[i].style.position = "static";
            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[i].style.position = "relative";
    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:false;';
        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.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, "MenuBarActive");
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
        return (navigator.vendor == 'Apple Computer, Inc.' && (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, "MenuBarSubmenuVisible");
            if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
                if(!this.hasClassName(this.element, "MenuBarHorizontal") || menu.parentNode.parentNode != this.element)
                    menu.style.top = menu.parentNode.offsetTop + 'px';
            if(typeof document.uniqueID != "undefined")
                this.createIframeLayer(menu);
        this.addClassName(this.element, "MenuBarActive");
    // 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, "MenuBarSubmenuVisible");
            if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
                menu.style.top = '';
                menu.style.left = '';
            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, isie)
        var opentime, closetime;
        var link = listitem.getElementsByTagName('a')[0];
        var submenus = listitem.getElementsByTagName('ul');
        var menu = (submenus.length > 0 ? submenus[0] : null);
        var hasSubMenu = false;
        if(menu)
            this.addClassName(link, "MenuBarItemSubmenu");
            hasSubMenu = true;
        if(!isie)
            // 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)
            if(self.bubbledTextEvent())
                // ignore bubbled text events
                return;
            clearTimeout(closetime);
            if(self.currMenu == listitem)
                self.currMenu = null;
            // show menu highlighting
            self.addClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
            if(menu && !self.hasClassName(menu, "MenuBarSubmenuVisible"))
                opentime = window.setTimeout(function(){self.showSubmenu(menu);}, 250);
        }, false);
        this.addEventListener(listitem, 'mouseout', function(e)
            if(self.bubbledTextEvent())
                // ignore bubbled text events
                return;
            var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
            if(!listitem.contains(related))
                clearTimeout(opentime);
                self.currMenu = listitem;
                // remove menu highlighting
                self.removeClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
                if(menu)
                    closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);
        }, false);

    It has to do with all of your absolutely positioned elements.  What's happening is that the menu is falling behind the absolutely positioned elements on your page.  Since there is nothing there, it's like trying to click a link that is outside your home while you are staring through a window.  Personally with that page setup you have now I really don't see a need for absolutely positioned elements.  But if you feel you will require them as part of your design you need to ensure the z-index of your menu layer is greater than that of the body elements positioned below it.

Maybe you are looking for