It is a very nice menu only on becarefull when using the horizontal version a screen wide menu-item that has a nested submenu does not expand back into the screen but falls of the side of the screen.
Rolf On 3/2/06, Barry Books <[EMAIL PROTECTED]> wrote: > > Tapestry MenuBar component based on > http://www.cssplay.co.uk/menus/dropdown.html > > The packaging is a bit rough and I don't have the container correct but > the > included one will work (Note the if IE). I'll make a better library out of > if soon and put it somewhere. Make sure your doctype is correct or it will > not work. The pull aside menu on IE has a format problem. I'm also hoping > it > can do this > > http://www.cssplay.co.uk/menus/flyoutt.html > > with the same input. > > -- My Border -- > <html xmlns="http://www.w3.org/1999/xhtml"; jwcid="@Shell" title="Acumera" > doctype='html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " > http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";' > > > > > > <link rel="stylesheet" media="all" type="text/css" > href="/Acumera/css/layout/fullWidth.css" /> > <link rel="stylesheet" media="all" type="text/css" > href="/Acumera/css/layout/menu.css" /> > > > <!--[if lte IE 6]> > <style type="text/css">@import "/Acumera/css/layout/menuie.css";</style> > <![endif]--> > > --- MenuBar.html --- > <div id="menubar"> > </div> > > --- MenuBar.jwc --- > <?xml version="1.0" encoding="UTF-8"?> > <!DOCTYPE component-specification PUBLIC "-//Apache Software > Foundation//Tapestry Specification 4.0//EN" " > http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd";> > <component-specification class="menu.MenuBar"> > </component-specification> > > --- Menu.java --- > > package menu; > > import java.io.BufferedOutputStream; > import java.io.ByteArrayOutputStream; > import java.io.CharArrayWriter; > import java.io.IOException; > import java.io.PrintWriter; > import java.io.Reader; > import java.io.StringReader; > > import javax.xml.transform.Transformer; > import javax.xml.transform.TransformerConfigurationException; > import javax.xml.transform.TransformerFactory; > > import org.apache.tapestry.AbstractComponent; > import org.apache.tapestry.BaseComponent; > import org.apache.tapestry.IMarkupWriter; > import org.apache.tapestry.IRequestCycle; > import org.apache.tapestry.markup.AsciiMarkupFilter; > import org.apache.tapestry.markup.MarkupFilter; > import org.apache.tapestry.markup.MarkupWriterImpl; > > /* > * based on http://www.cssplay.co.uk/menus/dropdownfun.html > * > * Put the non ie menu inside this component and it will output both > * the ie version and non ie version > * This combined with the ie and nonie stylesheets will create a > * dropdown menu system for ie and non ie browsers > * > * The code does not validate the non ie menu was resonable so no > * telling what happens if it's not. > * > * requires jaxp > */ > > public class MenuBar extends AbstractComponent { > protected CharArrayWriter _charArrayWriter; > > protected static String noniemenu = "" + > "<div id='noniemenu'>"+ > "<div class=\"holder\">"+ > "<ul>"+ > "<li><a class='outer' href='#'>Title</a></li>"+ > "<li><a class='inner second' href='#'>Programs ></a>"+ > "<ul id='a3'>"+ > "<li><a class='inner' jwcid='@PageLink' > page='Home'>Home</a></li>"+ > "<li><a class='inner' jwcid='@PageLink' > page='AcuVigil/Overview'>AcuVigil</a></li>"+ > "<li><a class='inner' jwcid='@PageLink' > page='Installer/TODO'>Installer</a></li>"+ > "<li><a class='inner' jwcid='@PageLink' > page='Admin/Admin'>Adminstration</a></li>"+ > "</ul>"+ > "</li>"+ > "<li><a class='inner' href='#'>Preferences</a></li>"+ > "<li><a class='inner' jwcid='@DirectLink' > listener='listener:doLogout'>Logout</a></li>"+ > "</ul>"+ > "</div>"+ > "</div>"; > > protected static String iemenu = ""+ > "<div class='menuie'>"+ > "<a class='outer' href='#'>Title<table class='first'>"+ > "<tr>"+ > "<td><a class='inner second' href='#'>Programs >"+ > "<table><tr><td>"+ > "<a class='inner' jwcid='@PageLink' > page='Home'>Home</a>"+ > "<a class='inner' jwcid='@PageLink' > page='AcuVigil/Overview'>AcuVigil</a>"+ > "<a class='inner' jwcid='@PageLink' > page='Installer/TODO'>Installer</a>"+ > "<a class='inner' jwcid='@PageLink' > page='Admin/Admin'>Adminstration</a>"+ > "</td></tr></table>"+ > "</a>"+ > > > "<a class='inner' href='#'>Preferences</a>"+ > "<a class='inner' jwcid='@DirectLink' > listener='listener:doLogout'>Logout</a>"+ > "</td></tr></table>" + > "</a>"+ > "</div>"; > > protected static String xslt = "<?xml version='1.0' > encoding='UTF-8'?>\n"+ > "<xsl:stylesheet version='1.0' xmlns:xsl=' > http://www.w3.org/1999/XSL/Transform'>\n"+ > "<xsl:output method='html'/>" + > "<xsl:template match=\"/[EMAIL PROTECTED] = 'noniemenu']\">" + > "<div class='menuie'>" + > "<xsl:apply-templates/>" + > "</div>" + > "</xsl:template>" + > > "<xsl:template match=\"[EMAIL PROTECTED] = 'holder']\">" + > "<a class='outer' href='index.html'>" + > "<xsl:value-of select='ul/li'/>"+ > "<xsl:apply-templates/>" + > "</a>" + > "</xsl:template>" + > > "<xsl:template match='ul'>" + > "<table class='first'><tr><td>" + > "<xsl:apply-templates/>" + > "</td></tr></table>" + > "</xsl:template>" + > > "<xsl:template match='li'>" + > "<xsl:apply-templates/>" + > "</xsl:template>"+ > > "<xsl:template match=\"[EMAIL PROTECTED] = 'inner']\">" + > "<xsl:element name='a'>" + > "<xsl:copy-of select='@*'/>" + > "<xsl:value-of select='.'/>" + > "</xsl:element>" + > "</xsl:template>"+ > > "<xsl:template match=\"[EMAIL PROTECTED] = 'outer']\">" + > "</xsl:template>"+ > > "<xsl:template match=\"[EMAIL PROTECTED] = 'a3']\">" + > "<a class='inner second' href='#'>" + > "<table class='second'><tr><td>" + > "<xsl:apply-templates/>"+ > "</td></tr></table>" + > "</a>" + > "</xsl:template>"+ > > "</xsl:stylesheet>"; > > > public void renderComponent(IMarkupWriter writer, IRequestCycle cycle) > { > IMarkupWriter w = newBufferWriter(); > > renderBody(w, cycle); > writer.printRaw > (_charArrayWriter.toCharArray(),0,_charArrayWriter.size()-1); > try { > writer.printRaw(getIeMenu(_charArrayWriter.toString())); > } catch (Exception e) { > writer.print(e.toString()); > } > } > > protected String getIeMenu(String noniemenu) throws Exception { > CharArrayWriter ie = new CharArrayWriter(); > javax.xml.transform.Result result = > new javax.xml.transform.stream.StreamResult(ie); > > > TransformerFactory transFact = TransformerFactory.newInstance( ); > > Transformer trans = transFact.newTransformer(new > javax.xml.transform.stream.StreamSource(new StringReader(xslt))); > trans.transform(new javax.xml.transform.stream.StreamSource(new > StringReader(noniemenu)), result); > > return ie.toString(); > } > > protected IMarkupWriter newBufferWriter() { > _charArrayWriter = new CharArrayWriter(); > PrintWriter pw = new PrintWriter(_charArrayWriter); > > return new MarkupWriterImpl("text/html", pw, new > AsciiMarkupFilter()); > } > > public static void main(String[] args) { > MenuBar b = new MenuBar(); > try { > System.out.println(b.getIeMenu(noniemenu)); > } catch (Exception e) { > // TODO Auto-generated catch block > e.printStackTrace(); > } > > } > > } > > > --- menu.css --- > > .menuie {display:none;} > #Anoniemenu {position:absolute; top: 110px;} > > #noniemenu .holder ul {padding:0; margin:0;} > #noniemenu .holder ul li {list-style-type: none;} > #noniemenu .holder li {} > #noniemenu .holder li ul {display: none;} > #noniemenu .holder li:hover > ul#a3 { > display:block; position:absolute; left:105px; margin-top:-20px; > border:1px solid #000; > } > #noniemenu .holder .bold {font-weight:bold;} > > #noniemenu .holder:hover { > height:auto; > color:black; > } > > #noniemenu .holder { > color:#fff; > width:104px; > height:18px; > display:block; > overflow:hidden; > float:left; > border:1px solid #000; > margin-right:1px; > font-size:10px; > } > > #noniemenu a.outer, #noniemenu a.outer:visited { > color:#fff; > width:104px; > line-height:18px; > display:block; > background:blue; > text-align:center; > text-decoration:none; > font-family: verdana, arial, sans-serif; > background-image: url(../../images/MenuBlueGrad.gif); > } > #noniemenu a.outer:hover { > background:#blue; > overflow:visible; > } > #noniemenu div.open {display:none;} > #noniemenu a.inner, #noniemenu a.inner:visited { > display:block; > width:104px; > height:18px; > line-height:18px; > border-bottom:1px solid #000; > text-decoration:none; > color:#000; > background:#eee; > text-align:center; > } > #noniemenu a.second {font-weight:bold;} > #noniemenu a.inner:hover { > background:#add; > } > > > > --- iemenu.css --- > > > > > #noniemenu {display:none; } > .menuie {display:block; } > .menuie a.outer, .menu a.outer:visited { > color:#fff; > width:104px; > height:18px; > display:block; > background:#e09222; > border:1px solid #000; > margin-right:1px; > text-align:center; > float:left; > text-decoration:none; > font-family: verdana, arial, sans-serif; > font-size:10px; > line-height:18px; > overflow:hidden; > background-image: url(../../images/MenuBlueGrad.gif); > > } > .menuie a.outer:hover { > background:blue; > overflow:visible; > } > .menuie a.outer:hover table.first { > display:block; > background:#eee; > border-collapse:collapse; > } > .menuie a.inner, .menu a.inner:visited { > display:block; > width:102px; > height:18px; > border-bottom:1px solid #000; > text-decoration:none; > color:#000; > font-family: verdana, arial, sans-serif; > font-size:10px; > text-align:center; > } > .menuie a.inner:hover { > background:#add; > } > > .menuie a.outer table.first a.second { > height:18px; > line-height:18px; > overflow:hidden; > font-weight:bold; > } > .menuie a.outer table.first a.second:hover { > position:relative; > overflow:visible; > } > .menuie a.outer table.first a.second:hover table { > position:absolute; > top:-2px; > left:102px; > border-collapse:collapse; > background:#eee; > border:1px solid #000; > font-weight:normal > } > >
