Trouble with Frames, Menu

Hi! I need some help. I am currently designing a webpage in
Dreamweaver MX. I am using a frameset, one of the frames is going
down the right of my page. I made a pop up menu in fireworks to put
in this frame. I inserted the menu's HTML and it looks fine, except
the menu pops out but it will only stay in that frame, so it gets
cut off. Also, whenever I click on one of the links in my menu, it
opens the new page in that tiny little frame that is made only for
the menu. Here is the code for my frame that contains the
menu.

Similar Messages

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" />

<title>Press Reviews of Paninos Italian Restaurant Food in three Colorado Locations</title>

<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" />

</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>

<div id="topnav">

<script type="text/javascript">

</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>

</div>

<div id="pagebg">
<div id="centralpageborder">

<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" />

<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">

</script>
            
            <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>
            </div>
</div>
<div id="bodybox">
<div id="pagetitle"><img src="../images/img_title_press_reviews_italian_restaurant.png" width="307" height="38" /></div>
<div id="innerbdybox">
<div id="content">
<div id="maintext">

<a name="skiptomaincontent" id="skiptomaincontent"></a>
<h1>A Tradition Food And Sports: <br />
                        CC & 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>
       </div>

      <div id="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" /></div>
      
</div>
      
<div id="linkssidebar">
        <p>The Gazette<br />
            The Coloradoan<br />
            The North Forty News<br />
            Colorado Springs Times</p>
</div>

</div>
<div id="footer"> </div>
<br />
<br />
</div> 
</div>
</div>
</div>
</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.

Dreamweaver trouble with Spry Menu

It must be getting late, as I can't seem to get this to work.
I am experimenting with a spry menu for the school I work at.
The site I made earlier is www.wmes.ca
The school would like to have the site updated, so I figured I would do so by using a spry menu in place of the one I did in photoshop with the drop downs (see above link). Personally i liked this method and found it quite easy, however, it is now a depracated feature.
As said already, I am working with just a goofy template I've made to see if I can make the spry menu work on a site that is 760 px wide. The menu appears to work, but it is not 760 px long. Also, in IE, the drop down menus span horizontally on the page instead of vertically. I can't explain this either.
The last thing my tired eyes can't detect is the place to make the text on rollover bold.
The current site can be viewed at www.prestigeinteractive.com/wmems
I would appreciate a fresh set of eyes.
Thanks for your time,
Greg
files are attached

The Spry menu customisation tutorial that David wrote may be of help to you: (this takes you to the width customisation page - but start at the beginning to understand all the style rules that apply to the menu).
http://foundationphp.com/tutorials/sprymenu/customize3.php
You need to specify a width in three places, so that IE doesn't show the submenus horizontally instead of vertically - explained in the tutorial link above.

Having Trouble with Spry Menu Bar Hover Image

I added a hover image to the spry menu bar, however, whenever I roll my mouse over the buttons all, but one of the buttons' fonts grow in size, also increase the size of the button. Can someone please help me with this?

Hello,
the culprit must be in your (horizontal or vertical) "SpryMenuBar.........al.css". Please send us a link to your website in question, so we can better analyze.
BUT, and 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.” “The news was released in August last year: http://blogs.adobe.com/dreamweaver/2012/08/update-on-adobe-spry-framework-availability.htm l”.
I'd recommend you switch to a jQuery library for your further requirements.
If you have a budget to work with, look at PVII's Pop-Menu Magic3:
http://www.projectseven.com/products/menusystems/pmm3/index.htm
jQuery Superfish (free): http://users.tpg.com.au/j_birch/plugins/superfish/ aso.
Hans-Günter

Some minor troubles with Spry Menu Bar

Hello all,
I'm currently in the process of building a simple navigation
menu for a website and have run into a bit of a snag. The image I
wish to have as my rollover background image seems to work in
non-sub menu list items, but they don't for those list items that
have sub menus. Interestingly enough, if I change it to a color, it
works fine.
Any thoughts or suggestions would be helpful.
Linky:
http://watchtower54.bravehost.com/c21Menu.htm
*edit*
After thinking about, I thought it might be benefical for me
to post the Stylesheet information, which is as follows

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

Trouble with tabbed menu

I'm a Flash newbie. I'm trying to create a tabbed menu in
Flash similar to
this one. On mine
however, when you click on the different buttons you go to another
web page and that is working fine. Also the rollover text works
fine too. However, I'm having trouble figuring out how to keep my
tab in the "down" state. On the iTab example previously mentioned,
the selected menu tab defaults to "Menus" and remains so until the
user selects another tab. In the down state, a raised or slightly
enlarged tab is shown. Thanks in advance.

It seems that what you need to be looking into is the concept
of button groups old boy.
Check
this out.

Trouble with Frame Size of AE Composition in Premiere CS6

I'm trying to add a name-bar (name-tag) from After Effects to my sequence in Premiere Pro. I built the name-tag in Illustrator according to the frame size in Premiere.
All of my name tags for a 640x480 frame fit perfectly. However, the tags I built for a 720x480 frame appear way, way too large. I can't figure out why. Below is an example of the issue I've been having:
As you can see, the bar on the bottom extends beyond the frame -- but I built it to be the same 720x480 frame size as the video clip.
So, without further adieu...help me. Please.

Alright, (sorry for the delayed response) here are the settings for the AE composition:
And there Sequence Settings:
And the video properties (2 images):
I hope this helps you help me.

Help with Horizontal Menu Bar in IE

I am having trouble with my menu bar in IE. It works fine in Opera, Firefox, and Safari. In IE when you hover over it it opens on the left hand side and not straight down. I have tried many things others have suggested with no luck. I am not very good with code and this is the first website I have worked on as part of my job (wasn't hired on as a web designer! I work on a horse farm!). Here is the link to the site www.garnercreekfarms.com.
Here is my JS:
// SpryMenuBar.js - version 0.12 - 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.
var Spry; if (!Spry) 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];
Here is my 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: auto;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 70em;
/* 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: 10em;
float: left;
color: #F59CB0;
background-color: #FFF;
/* 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
width: 250px;
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: 9px;
color: #EF9CCF;
background-color: #FFF;
/* 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;
/* 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: #EB91B6;
text-decoration: none;
text-align: center;
/* 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: #FFF;
color: #EF93B0;
text-align: center;
font-size: 100%;
/* 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: #FFF;
color: #EF93B0;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
color: #EF93B0;
background-color: #FFF;
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%;
color: #EF9CCF;
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 a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
color: #EF93B0;
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;
#table2 tr .header p {
font-family: "Apple Chancery";
#table2 tr .header .regular2 {
font-family: "Times New Roman", Times, serif;

Alyssa,
Have you tried putting this rule back as it was originally:
/* 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; /*was 9px*/
    color: #EF9CCF;
    background-color: #FFF;
That is, changing your 9px back to auto.
And giving us a link (as you did) is much better than printing out the code for us! Thanks!
Beth

HT3180 Anyone having trouble with Netflix not showing up in the internet menu? I am trying to do a reset, but it says it can't download latest updates try again later.

Anyone having trouble with Netflix not showing up on the Internet Menu? I have tried to do a reset and then restore, but it says that "the latest update download cannot be done at this time, try again later"

If your problem persists get yourself a micro USB cable (sold separately), you can restore your Apple TV from iTunes:
Remove ALL cables from Apple TV. (if you don't you will not see Apple TV in the iTunes Source list)
Connect the micro USB cable to the Apple TV and to your computer.
Open iTunes.
Select your Apple TV in the Source list, and then click Restore.

Java Swing frame for modification Excel file or Word file with All menu...

Hello All,
Can Any one help me for making java Swing frame for modification Excel Data or word file with all Menu.. Plz send me java Code for that.. I am bit new in Swing.
i am waiting for ur help..
Thanks
Samir

hi pbrockway2 ,
Can you go through this program Sir, i am trying to call Excel content below of menu. when i will press Edit button then excel content should come below with Cut, copy, paste , Save Button..
Plz help me sir...
import javax.swing.*;
import java.io.*;
import java.awt.event.*;
public class TestReader
private static void createAndShowUI()
JFrame.setDefaultLookAndFeelDecorated(true);
JFrame frame=new JFrame("Test Reader");
JButton button=new JButton("Edit");
button.addActionListener(new ButtonListener());
frame.getContentPane().add(button);
frame.setVisible(true);
frame.pack();
static class ButtonListener implements ActionListener
public void actionPerformed(ActionEvent event)
openTheFile();
private static void openTheFile()
try
String commands[]=new String[3];
commands[0]="cmd.exe";
commands[1]="/C";
commands[2]="INSTALL.LOG"; // here file name is supposed to be in the working dir
Runtime rt=Runtime.getRuntime();
Process proc=rt.exec(commands);
StreamGobbler errorGobbler=new StreamGobbler(proc.getErrorStream(),"ERROR");
StreamGobbler outputGobbler=new StreamGobbler(proc.getInputStream(),"OUTPUT");
errorGobbler.start();
outputGobbler.start();
catch (Exception e){}
public static void main(String args[])
SwingUtilities.invokeLater(new Runnable()
     public void run()
     createAndShowUI();
static class StreamGobbler extends Thread
InputStream is;
String type,root;
StreamGobbler(InputStream is,String type)
this.is=is;
this.type=type;
public void run()
try
InputStreamReader isr=new InputStreamReader(is);
     BufferedReader breader=new BufferedReader(isr);
     String line=null;
     while ((line=breader.readLine())!=null)
     System.out.println(type+">"+line);
catch (Exception e)
     System.out.println(e);
Thanks
SamiR

HT1320 Hello! My name is Ed. I'm having trouble with my Ipod classic, it keep freezing up on me and i can't unfreeze my Ipod. I hold down the menu button on the wheel and still won't do anything. All my Ipod classic do this. But my Ipod Touch, I don't hav

Hello, my name is Ed. I'm with all my Ipod, I have (4) they all keep freezing up on me when I play my devices. But my Ipod Touch I don't have this problem. On my classic I'll hold down menu botton on the wheel. But thing happen, I'm tired of letting battery go dead and recharge it, just to freeze up again. I made it work one time by holding down the menu button. That's about it. I need help.
Ed Shelton
PS I don't know operation system on my ipod classic, but on my mac book pro i am using (11.0.2) my mac os x (10.6.8). So, I try to take a quess at my os my classic

Holding down the center/select button and the menu button will reboot your ipod. See if that helps. Also, I'd recommend something else- I had nothing but trouble with my ipod classic until I spent $20 to get Mac OS Mountain Lion. It did what you said and sometimes wouldnt play, or wouldnt power on...
Try rebooting your ipod and let me know what happens and maybe in the future obtain Mountain Lion to aide your ipod in functionality.
Good luck!

Trouble with "body" images lining up at the top

Hi, I am having troubles with the #body style in my web page. I have inserted a table into the #body area and the the body editable region will not line up on the top with the sideBar editable region when I add text and apply my css to it. Can you look at the code and let me know what I am doing wrong? Thanks!
<!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>Ram Restaurant & Brewery</title>

<meta name="keywords" content="Ram Restaurant, The Ram restaurant, Ram Restaurant and brewpub, Ram Restaurant Group, Ram International" />
<meta name="description" content="Welcome to The Ram! Your stomach wants food. Your tastebuds want beer. Satisfy them both at the Ram Restaurant & Brewery." />
<style type="text/css">

</style>
<link href="/RamWebsite_NEW/cssstyles.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>

<script src="/RamWebsite_NEW/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<link href="/RamWebsite_NEW/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />


</head>
<body link="#000000" topmargin="0" onload="MM_preloadImages('/RamWebsite_NEW/images/Menu_rollover.jpg','/RamWebsite_NEW/imag es/EventsLink2_rollover.jpg','/RamWebsite_NEW/images/GiftCards_rollover.jpg','/RamWebsite_ NEW/images/BeerLink2_rollover.jpg')">
<div id="wrapper">
<div id="header">
    <table width="900" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <th width="200" height="36" rowspan="2" align="center" valign="middle" scope="col"><a href="http://www.theram.com"><img src="/RamWebsite_NEW/images/Ram-Logo-red.gif" alt="Ram Restaurant & Brewery Logo" width="175" height="69" border="0" /></a></th>
        <th width="350" height="50" align="center" valign="middle" scope="col"> </th>
        <th width="200" align="center" valign="middle" scope="col"> </th>
        <th width="150" align="right" valign="middle" scope="col"><a href="http://www.facebook.com/home.php?#!/theramrestaurant?ref=ts"><img src="/RamWebsite_NEW/images/FacebookBox.gif" alt="Becoma a Facebook Fan!" width="40" height="40" border="0" /></a><a href="http://www.twitter.com/theram"><img src="/RamWebsite_NEW/images/TwitterBox.gif" alt="Follow Us on Twitter" width="40" height="40" hspace="30" border="0" /></a></th>
      </tr>
      <tr>
        <th colspan="3" align="right" scope="col"><ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a class="MenuBarItemSubmenu" href="#">MENU</a>
            <ul>
              <li><a href="#" class="MenuBarItemSubmenu">Idaho</a>
                <ul>
                  <li><a href="/menus/idaho/boise.shtml">Boise</a></li>
                  <li><a href="/menus/idaho/meridian.shtml">Meridian</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Illinois</a>
                <ul>
                  <li><a href="/menus/illinois/rosemont.shtml">Rosemont</a></li>
                  <li><a href="/menus/illinois/schaumburg.shtml">Schaumburg</a></li>
                  <li><a href="/menus/illinois/wheeling.shtml">Wheeling</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Indiana</a>
                <ul>
                  <li><a href="/menus/indiana/fishers.shtml">Fishers</a></li>
                  <li><a href="/menus/indiana/indianapolis.shtml">Indianapolis</a></li>
</ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Oregon</a>
                <ul>
                  <li><a href="/menus/oregon/clackamas.shtml">Clackamas</a></li>
                  <li><a href="/menus/oregon/salem.shtml">Salem</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Washington</a>
                <ul>
                  <li><a href="/menus/washington/kent.shtml">Kent</a></li>
                  <li><a href="/menus/washington/lacey.shtml">Lacey</a></li>
                  <li><a href="/menus/washington/lakewood.shtml">Lakewood</a></li>
                  <li><a href="/menus/washington/puyallup.shtml">Puyallup South Hill Mall</a></li>
                  <li><a href="/menus/washington/puyallup2.shtml">Puyallup Sunrise Village</a></li>
                  <li><a href="/menus/washington/northgate.shtml">Seattle Northgate</a></li>
                  <li><a href="/menus/washington/seattle.shtml">Seattle University Village</a></li>
                  <li><a href="/menus/washington/tacoma.shtml">Tacoma</a></li>
                </ul>
              </li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">LOCATIONS</a>
            <ul>
              <li><a href="#" class="MenuBarItemSubmenu">Idaho</a>
                <ul>
                  <li><a href="/idaho/boiseNew.html">Boise</a></li>
                  <li><a href="/idaho/meridianNew.html">Meridian</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Illinois</a>
                <ul>
                  <li><a href="/illinois/rosemontNew.html">Rosemont</a></li>
                  <li><a href="/illinois/schaumburgNew.html">Schaumburg</a></li>
                  <li><a href="/illinois/wheelingNew.html">Wheeling</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Indiana</a>
                <ul>
                  <li><a href="/indiana/fishersNew.html">Fishers</a></li>
                  <li><a href="/indiana/indianapolisNew.html">Indianapolis</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Oregon</a>
                <ul>
                  <li><a href="/oregon/clackamasNew.html">Clackamas</a></li>
                  <li><a href="/oregon/salemNew.html">Salem</a></li>
                </ul>
              </li>
              <li><a href="#" class="MenuBarItemSubmenu">Washington</a>
                <ul>
                  <li><a href="/washington/kentNew.html">Kent</a></li>
                  <li><a href="/washington/laceyNew.html">Lacey</a></li>
                  <li><a href="/washington/lakewoodNew.html">Lakewood</a></li>
                  <li><a href="/washington/puyallup-southHill-NEW.html">Puyallup South Hill Mall</a></li>
                  <li><a href="/washington/puyallup-Sunrise-New.html">Puyallup Sunrise Village</a></li>
                  <li><a href="/washington/northgateNew.html">Seattle Northgate</a></li>
                  <li><a href="/washington/seattleNew.html">Seattle University Village</a></li>
                  <li><a href="/washington/tacomaNew.html">Tacoma</a></li>
                </ul>
              </li>
            </ul>
          </li>
          <li><a class="MenuBarItemSubmenu" href="#">PROMOS</a>
            <ul>
              <li><a href="/drink_specials.shtml">Drink Promos</a>              </li>
              <li><a href="/food_specials.shtml">Food Promos</a></li>
</ul>
          </li>
          <li><a href="/news.shtml">RAM NEWS</a></li>
          <li><a href="/about.shtml">ABOUT US</a></li>
          <li><a href="#" class="MenuBarItemSubmenu">CONTACT US</a>
            <ul>
              <li><a href="/contact.shtml">General Info</a></li>
              <li><a href="/employment.shtml">Careers</a></li>
              <li><a href="/comments.shtml">Comments</a></li>
            </ul>
          </li>
          <li><a href="/banquets.shtml" class="MenuBarItemSubmenu">BANQUETS</a>
            <ul>
              <li><a href="/banquets.shtml">Banquets</a></li>
              <li><a href="/banquets-catering.shtml">Off-Site Catering</a></li>
            </ul>
          </li>
        </ul></th>
      </tr>
      <tr>
        <th colspan="4" align="center" valign="middle" scope="col"><img src="/RamWebsite_NEW/images/redbar.gif" width="900" height="11" /></th>
      </tr>
    </table>
</div>
<div id="body">
<table width="900" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <th height="300" valign="top" scope="col"><table width="900" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <th width="225" align="center" valign="top" bgcolor="#000000" scope="col">adfadsfds</th>
          <th width="675" align="left" valign="top" bgcolor="#FFFFFF" scope="col">
            <p><img src="/images/aboutus2.jpg" width="675" height="300" /></p>
            <p class="foodNameDesc">adfadslkj</p>
          </th>
        </tr>
      </table></th>
    </tr>
</table>
</div>
<div id="bottomMenuSubPg">
<table width="900" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <th width="200" align="center" scope="col"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Menu','','/RamWebsite_NEW/images/Menu_rollover.jpg',1)"><img src="/RamWebsite_NEW/images/Menu.jpg" alt="Menu" name="Menu" width="212" height="125" hspace="6" border="0" id="Menu" /></a></th>
      <th width="200" align="center" scope="col"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Big Horn Beer','','/RamWebsite_NEW/images/BeerLink2_rollover.jpg',1)"><img src="/RamWebsite_NEW/images/BeerLink2.jpg" alt="Big Horn Beer" name="Big Horn Beer" width="212" height="125" hspace="6" border="0" id="Big Horn Beer" /></a></th>
      <th width="200" align="center" scope="col"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Events','','/RamWebsite_NEW/images/EventsLink2_rollover.jpg',1 )"><img src="/RamWebsite_NEW/images/EventsLink2.jpg" alt="Events at the Ram" name="Events" width="212" height="125" hspace="6" border="0" id="Events" /></a></th>
      <th width="200" align="center" scope="col"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Gift Cards','','/RamWebsite_NEW/images/GiftCards_rollover.jpg',1)"><img src="/RamWebsite_NEW/images/GiftCards.jpg" alt="Gift Cards" name="Gift Cards" width="212" height="125" hspace="6" border="0" id="Gift Cards" /></a></th>
    </tr>
</table>
</div>
<div id="bottommenu2"></div>
<map name="Map" id="Map">
<area shape="poly" coords="16,103" href="#" />
<area shape="poly" coords="49,71,102,58,158,73,191,113,180,141,151,161,109,169,65,162,31,141,18,112" href="http://theram.fbmta.com/members/UpdateProfile.aspx?Action=Subscribe&InputSource=W" target="_blank" />
</map>
<script type="text/javascript">

</script>
</div>
</body>
</html>

You have your image in the 'body editable region' wrapped in <p></p> tags (paragraph tags). <p> tags have padding and margin set on them by default.
<p><img src="/images/aboutus2.jpg" width="675" height="300" /></p>
You can either just remove the <p></p> tags or you can zero out the padding and margin:
p {
padding: 0;
margin: 0;
Unfortuanately the above will target every paragraph on your page which might not be desirable so I would just remove the <p> tags as it is not necessary to wrap an image in them.
If you do want to keep the <p> tags then use some inline css to specifically remove the padding and margin on that particular one:
<p style="padding: 0; margin: 0;"><img src="/images/aboutus2.jpg" width="675" height="300" /></p>

Newbie having trouble with opt/rep regions

Hi everyone. I'm migrating my site from simple, square html
to nice, elegant css. I've done most of the work, but I'm having
some trouble with templates. Here's an example of how a page
created with a template will (hopefully) look:
http://www.technfun.com/temp/example.html
I've succeeded in making the article region (inside the white
frame) editable, but I can't figure out how to handle the side bar
menu. It's supposed to contain links to the chapters and
subchapters of the main article, so that clicking there will bring
you to the right place in the page (a simple # link, in other
words). However, the article writer (me) needs to be able to add as
many "SidebarLarge" entries as necessary. Under each of those there
may or may not be the need to add "SidebarSmall" entries for
subchapters.
I read the help file and figured out I need to do something
with the optional and repeating region settings, but whenever I try
I only ever manage to make a mess of the sidebar. Anyone can tell
me how exactly I'm supposed to do this?
Thanks :)

Why not just make the whole sidebar an editable region
instead? Then you
can add as much stuff as you see fit.
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
==================
"TechNFun" <[email protected]> wrote in
message
news:gda2tq$2v9$[email protected]..
> Hi everyone. I'm migrating my site from simple, square
html to nice,
> elegant
> css. I've done most of the work, but I'm having some
trouble with
> templates.
>
[url=http://www.technfun.com/temp/example.html]Here[/url]'s an
example of
> how a
> page created with a template will (hopefully) look.
>
> I've succeeded in making the article region (inside the
white frame)
> editable,
> but I can't figure out how to handle the side bar menu.
It's supposed to
> contain links to the chapters and subchapters of the
main article, so that
> clicking there will bring you to the right place in the
page (a simple #
> link,
> in other words). However, the article writer (me) needs
to be able to add
> as
> many "SidebarLarge" entries as necessary. Under each of
those there may or
> may
> not be the need to add "SidebarSmall" entries for
subchapters.
>
> I read the help file and figured out I need to do
something with the
> optional
> and repeating region settings, but whenever I try I only
ever manage to
> make a
> mess of the sidebar. Anyone can tell me how exactly I'm
supposed to do
> this?
> Thanks :)
>

I have had trouble with scrollbars using netbeans 5.5.1

I have had trouble getting a vertical and horizontal scrollbar working in my GUI. I am new to programming but I have books but I find them difficult to follow because they follow the old netbeans GUI models that requires all of the code to be written for example the scrollbar has to be created and then the parameters have to be set. However with the 5.5.1 the scrollbar has already been created and the parameters of the maximum the minimum and the event have already been set.
Therefore when you follow the books they explain the whole process rather than the last part which is all that is needed. I have selected the scrollbar and then pressed the right mouse button to get the menu up where I selected Events and then Adjustments, which then displayed the following script,
" private void jScrollBar1AdjustmentValueChanged(java.awt.event.AdjustmentEvent evt) {
// TODO add your handling code here:"
I know that I have to delete the //TODO add your handling code here and then insert the event handling code. I have tried to put in a lot of different event handler codes to try to get it to work but I have had no luck. Can anybody help. I have asked a few people but they have had trouble with it too.

Please can somebody provide me with a scirpt example.
I would really appreciate it.This was not made in Netbeans but it shows you how to use scrollpanes with a viewportview and listeners.
import java.awt.Dimension;
import java.awt.event.KeyEvent;
import java.awt.event.KeyListener;
import javax.swing.JFrame;
import javax.swing.JScrollPane;
import javax.swing.JTextPane;
import javax.swing.WindowConstants;
public class SwingExample {
     public static void main(String[] args) {
          JFrame frame = new JFrame("Test");
          //Create scrollpane
          JScrollPane scrollpane = new JScrollPane();
          //Create textpane to embed in Scrollpane
          JTextPane textPane = new JTextPane();
          //Add listener to textpane to listen for a KeyEvent
          textPane.addKeyListener(new KeyListener() {
               //unimplemented methods, not reuqired for example
               public void keyPressed(KeyEvent arg0) {}
               public void keyReleased(KeyEvent arg0) {}
               //Implemented method - prints current key typed.
               public void keyTyped(KeyEvent arg0) {
                    char myChar = arg0.getKeyChar();
                    System.out.println("You Typed: "+myChar);
          //Add textpane to scrollpane
          scrollpane.setViewportView(textPane);
          //add scrollpane to frame
          frame.add(scrollpane);
          frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
          frame.setVisible(true);
          frame.setSize(new Dimension(400,400));
}

Trouble with css background

Hey guys, I am having trouble with some code. I have nested divs inside of a container dive for the body copy, but I am having trouble with the background of the container div going behind the nested divs. I only have this issue with the background when I go to float the nested divs.
Below is a copy of my html and a copy of my linked css style sheet.
<!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>Welcome to Optimus Lens</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>
<style type="text/css">
#sector {
     background-repeat: no-repeat;
     background-position: left;
     width: 869px;
     margin-top: -51px;
     margin-right: auto;
     margin-bottom: 0;
     margin-left: auto;
#oag {
     width: 574px;
     margin-left: 23px;
     float: left;
     /* [disabled]position: relative; */
#small_col {
     width: 279px;
     margin-right: 23px;
     float: right;
     /* [disabled]position: static; */
</style>
</head>
<body onload="MM_preloadImages('images/home_over.jpg','images/our_mission_over.jpg','images/products_over.jpg','images/news_over.jpg','images/order_over.jpg','images/contact_over.jpg')">
<div id="CONTAINER">
       <div id="header"><img src="images/header_top.png" width="916" height="39" />
       <img src="images/header_logo.jpg" width="916" height="95" />
      <img src="images/header_image.jpg" width="916" height="266" />
       <img src="images/header_bar.jpg" width="916" height="9" />
</div>
      <div id="menuContainer">
     
                <ul>
                <li>
                <img src="images/fold_left_top.png" width="22" height="35" /><img src="images/menu_left.jpg" width="197" height="35" />
                </li>
                <li>
                    <div class="menu n1"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('home','','images/home_over.jpg',1)"><img src="images/home_up.jpg" alt="home" name="home" width="66" height="35" border="0" id="home" /></a></div></li>
                <li>
                  <div class="menu n2"><a href="mission.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Our Mission','','images/our_mission_over.jpg',1)"><img src="images/our_mission_up.jpg" alt="Our Mission" name="Our Mission" width="124" height="35" border="0" id="Our Mission" /></a></div></li>
                <li>
                    <div class="menu n3"><a href="products.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Products','','images/products_over.jpg',1)"><img src="images/products_up.jpg" alt="products" name="Products" width="98" height="35" border="0" id="Products" /></a></div></li>
                <li>
                    <div class="menu n4"><a href="news.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('News','','images/news_over.jpg',1)"><img src="images/news_up.jpg" alt="News" name="News" width="77" height="35" border="0" id="News" /></a></div></li>
                <li>
                    <div class="menu n5"><a href="order.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Order','','images/order_over.jpg',1)"><img src="images/order_up.jpg" alt="Order" name="Order" width="77" height="35" border="0" id="Order" /></a></div></li>
                <li>
                  <div class="menu n6"><a href="contact.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','images/contact_over.jpg',1)"><img src="images/contact_up.jpg" alt="Contact" name="Contact" width="80" height="35" border="0" id="Contact" /></a></div></li>
                <li>
                  <img src="images/menu_right.jpg" width="197" height="35" /><img src="images/fold_right_top.png" width="22" height="35" /> </li>
                </ul>
      </div>
       <div id="header_bottom"><img src="images/fold_left_bottom.png" width="22" height="38" /><img src="images/header_bottom.jpg" width="916" height="38" /><img src="images/fold_right_bottom.png" width="22" height="38" />
    </div>
     <div id="bodycopy">
       <div id="sector">
      <img src="images/home/sector_top.png" width="869" height="341" alt="sector frames" />
      </div>
       <p> </p>
       <div id="oag">
      <img src="images/home/oag_join.png" width="574" height="281" alt="save with oag" />
      <p> </p>
      <img src="images/home/bottom.png" width="574" height="132" />
      </div>
      <div id="small_col">
      <img src="images/home/optimize_small.png" width="279" height="132" />
      <p> </p>
      <img src="images/home/intuition_small.png" width="279" height="132" />
      <p> </p>
      <img src="images/home/intuition_small.png" width="279" height="132" />
      </div>
     </div>
    <div id="footer"><img src="images/footer.png" width="916" height="52" />
</div>
</div>
</body>
</html>body {
     margin: 0px;
     background-image: url(images/background_fade_04.jpg);
     background-repeat: repeat-x;
     background-position: top;
     background-color: #DCDCDC;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 13px;
#box1 {
     background-image: url(images/bodycopybox_01.png);
     background-repeat: no-repeat;
     background-position: left;
     height: 54px;
     width: 869px;
     margin-top: 0;
     margin-right: auto;
     margin-bottom: 0;
     margin-left: auto;
#box2 {
     background-image: url(images/bodycopybox_02.png);
     background-repeat: repeat-y;
     background-position: left;
     width: 869px;
     margin-top: 0;
     margin-right: auto;
     margin-bottom: 0;
     margin-left: auto;
.bodycopybox {
     padding-right: 40px;
     padding-left: 40px;
.bodycopyboxheader {
     padding-right: 40px;
     padding-left: 40px;
     font-weight: bolder;
     font-family: Arial, Helvetica, sans-serif;
     font-size: 14px;
     color: #21368b;
#box3 {
     background-image: url(images/bodycopybox_04.png);
     background-repeat: no-repeat;
     background-position: left;
     height: 31px;
     width: 869px;
     margin:0 auto;
#box4 {
     background-image: url(images/bodycopybox_03.png);
     background-repeat: no-repeat;
     background-position: left;
     height: 31px;
     width: 869px;
     margin:0 auto;
p {
     margin: 0px;
#header_bottom {
     width: 960px;
     margin:0 auto;
#CONTAINER {
     width: 100%;
     margin:0 auto;
#header {
     width: 916px;
     margin:0 auto;
#menuContainer {
     width: 960px;
     margin:0 auto;
     height: 35px;
#menuContainer ul{
     list-style:none;
     height:35px;
     margin:0;
     padding:0;
#menuContainer li{
     float:left;
     height:35px;
     margin:0;
     padding:0;
#menuContainer li a{
     text-align:center;
     float:none;
     height:35px;
     margin:0;
     padding:0;
div.menu{position:relative;}
.n1{
     width:66px;
     float:left;
     display:inline-block;
     clear:both;
.n2{
     width:124px;
     float:left;
     display:inline-block;
     clear:both;
.n3{
     width:98px;
     float:left;
     display:inline-block;
     clear:both;
.n4{
     width:77px;
     float:left;
     display:inline-block;
     clear:both;
.n5{
     width:77px;
     float:left;
     display:inline-block;
     clear:both;
.n6 {
     width:80px;
     float:left;
     display:inline-block;
     clear:both;
#bodycopy {
     background-color: #FFFFFF;
     width: 916px;
     padding: 0px;
     margin-top: 0;
     margin-right: auto;
     margin-bottom: 0;
     margin-left: auto;
#footer {
     width: 916px;
     margin:0 auto;
     padding: 0px;

Try this:
#CONTAINER {
width: 900px;
margin:0 auto;
background: #FFF;
overflow:hidden; /**float containment**/
/**There is no need for #sector division, you can delete it.**/
#oag {
width: 574px;
float: left;
margin-left: 25px;
#small_col {
width: 279px;
float: right;
margin-right: 25px;
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Trouble with Frames, Menu

Similar Messages

Maybe you are looking for