Hi, I have used vertical splitter along with JSF (facelets + richfaces) and YUI - it is working fine and PERFECT. however, I am unable to integerate the horizontal splitter in my code. Can any one plese help me out .. I am attaching the code below. Please someone help me in it ..
<?xml version="1.0" encoding="ISO-8859-1"?> > <!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"; > xmlns:ui="http://java.sun.com/jsf/facelets"; > xmlns:h="http://java.sun.com/jsf/html"; > xmlns:t="http://myfaces.apache.org/tomahawk"; > xmlns:f="http://java.sun.com/jsf/core"; > xmlns:rich="http://richfaces.org/rich"; > xmlns:c="http://java.sun.com/jstl/core"; > xmlns:a4j="http://richfaces.org/a4j";> > > <ui:composition> > <ui:debug hotkey="d"/> > <c:set var="contextRoot" > value="#{facesContext.externalContext.request.contextPath}" /> > <head> > <link type="text/css" rel="stylesheet" > href="#{contextRoot}/css/palier.css"/> > <link type="text/css" rel="stylesheet" > href="#{contextRoot}/css/flexiblestyle.css"/> > <link type="text/css" rel="stylesheet" > href="#{contextRoot}/css/reset-fonts-grids.css"/> > <script src="${contextRoot}/script/webScripts.js" > type="text/javascript"></script> > <script type="text/javascript" > src="#{contextRoot}/script/jquery-1.2.6.js"></script> > <script type="text/javascript" > src="#{contextRoot}/script/splitter.js"></script> > <link rel="stylesheet" type="text/css" > href="#{contextRoot}/css/jquery-main.css" /> > <title><ui:insert name="title">Default > title</ui:insert></title> > </head> > <body style="margin: 0;padding: 0;"> > <f:view> > <script language="javascript"> > var disableRowClick = false; > jQuery.noConflict(); > </script> > > <!-- h:form id="palierForm" enctype="multipart/form-data" > styleClass="formWrap" --> > <!-- start doc3 div --> > <div id="doc3" class="yui-t1"> > <a4j:region id="region"> > <!-- start hd --> > <div id="hd"> > <ui:include src="header.xhtml"/> > </div> > <!-- start menu --> > <div id="menu"> > <ui:include src="menu.xhtml"/> > </div> > > <div id="bd"> > <div id ="MyTestOne"> > <!-- start top --> > > <div id="flexible-top" class="yui-g"> > <!-- start column1 --> > <div id="flexible-col1" > class="yui-u first"> > <ui:include > src="leftPage.xhtml"/> > </div> > > <!-- start column2 --> > <div id="flexible-col2" > class="yui-u"> > <ui:include > src="rightPage.xhtml"/> > </div> > </div> > <!-- end top --> > <!-- start bottom --> > > > <div id="flexible-bottom" > class="yui-g" > > <t:panelGroup id="bottomTabs" > forceId="true" styleClass="fullHeight"> > <c:choose> > <c:when > test="#{genericController.bottomDivStyle != 'flexible-bottom-default'}"> > <div > class="bottomColDiv"> > <ui:include > src="#{genericController.bottomPage}"/> > </div> > </c:when> > <c:otherwise> > <ui:include > src="#{genericController.bottomPage}"/> > </c:otherwise> > </c:choose> > </t:panelGroup> > </div> > <!-- end bottom --> > </div> > </div> > <!-- bd --> > <rich:jQuery > selector="##{genericController.topDivStyle}" name="mysplit" > query="splitter({type: 'v',initA: true, minA: 300,maxA: 800})" > timing="onload"/> > <rich:jQuery selector="#MyTestOne" > name="horiSplit" query="splitter({type: 'h'})" timing="onload"/> > <rich:jQuery selector="window" > name="windowResize" query="bind('resize', > function(){jQuery('##{genericController.topDivStyle}').trigger('resize');}).trigger('resize')" > timing="onload"/> > > <!--/t:panelGroup --> > > <!-- start footer --> > <div id="ft"> > <ui:include src="footer.xhtml"/> > </div> > <!-- end footer --> > </a4j:region> > </div> > <!-- /h:form --> > </f:view> > </body> > </ui:composition> > > </html> > ..alee http://techboard.wordpress.com
