estou desenvolvendo uma aplicação utilizando os componentes visuais primefaces. É um modelo padrão que todo mundo acho que já fez: um menu que ao clicar na opção desejada abre uma tela com um grid que está ligado a uma tabela. Quem programou em Delphi conhece muito bem o estilo. Mas acontece que ao passar o mouse em cima da barra de menu, a lista da opção selecionada está aparecendo atras do componente do primefaces, ou seja, atras do grid.
Basicamente ho html é uma pagina index.html que tem uma div que é carregada dinamicamente de acordo com a opção selecionada.
Quando aconteceu isso comigo eu alterei o css da minha app:
.ui-layout-north {
z-index: 3!important;
overflow: visible!important;
}
.ui-layout-north .ui-layout-unit-content {
overflow: visible!important;
}
Olá amigo, não funcionou. Estou usando os themes, retirei do web.xml.
Tenho um arquivo chamado geral.css, que carrego logo no início:
Coloquei o que vc fez nesse arquivo mas não funcionou. O menu que estou usando não é do primefaces, será esse o problema? Porque o css desse menu é outro.
Eu uso algo parecido, talvez te ajude.
Mas não usa ajax para mudar de tela.
Template
<?xml version='1.0' encoding='UTF-8' ?>
<!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:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<ui:include src="../WEB-INF/component/header.xhtml"/><!--aqui estou incluindo um xhtml que tem meus estilos personalizados e eventuais js's-->
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="50">
<ui:include src="../WEB-INF/component/menu.xhtml"/><!--aqui estou incluindo um xhtml com o menu no seu caso já deve ter isso pronto-->
</p:layoutUnit>
<p:layoutUnit position="center">
<ui:insert name="content">Content</ui:insert>
</p:layoutUnit>
</p:layout>
<ui:insert name="out">Out</ui:insert>
<p:ajaxStatus onstart="statusDialog.show();" onsuccess="statusDialog.hide();"/>
<p:dialog modal="true" widgetVar="statusDialog" header="Aguarde...."
draggable="false" closable="false">
<p:graphicImage library="images" name="ajaxloadingbar.gif" alt="Aguarde...."/>
</p:dialog>
</h:body>
</html>
Um exemplo de cliente do template
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
template="../../template/report.xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<ui:define name="content">
<!--aqui vai o conteudo da sua pagina-->
</ui:define>
<ui:define name="out">
<!--aqui vai todos os dialogs pois o p:layout impacta na exibição dos dialig's-->
</ui:define>
</ui:composition>
E o trecho do css para o menu sobrepor o restante da tela
Voce esta usando tags html ao inves de usar as tags do primefaces, e provavelmente dentro de um arquivo .html, verifique, pois o JSF roda por padrão em arquivos .XHTML
TAGS HTML
li class='has-sub '><a href='#' onclick="abrirPag('cadastros/companyList.jsf');">Empresas</a>
<li class='has-sub '><a href='#' onclick="abrirPag('cadastros/clientList.jsf');">Clientes</a>
[quote=rof20004][quote]
Alguém tem alguma ídeia do que possa estar acontecendo?
[/quote]
Voce esta usando tags html ao inves de usar as tags do primefaces, e provavelmente dentro de um arquivo .html, verifique, pois o JSF roda por padrão em arquivos .XHTML
TAGS HTML
li class='has-sub '><a href='#' onclick="abrirPag('cadastros/companyList.jsf');">Empresas</a>
<li class='has-sub '><a href='#' onclick="abrirPag('cadastros/clientList.jsf');">Clientes</a>
está me ajudando bastante, lhe agradeço muito. Então resolvi seguir seus passos e resolvi fazer um pequeno teste aqui. mas na hora de rodar que nao aparece nada, a tela fica em branco. Nao consegui ver onde está o erro, pode me dar uma ajuda?
Abaixo segue os fontes,
Criei um menu2.html, o principal:
<?xml version='1.0' encoding='UTF-8' ?>
E os menu.xhtml e header.xhtml, o menu peguei do próprio site da primefaces, e está funcionando perfeitamente.
Vamo na doida, depois dessa doida vo da um tempo que vo almoçar, mas tarde to ae, pra nos bater cabeça, negocio ae ta esquisito, parece ate erro de CSS mesmo.
Faz assim, tira esse background.
<style type="text/css">
body {background:url('./defaultTheme/img/bg_bluewhite2.png') repeat-x;}
</style>