Autor Tópico: Menu de itens ocupando 100% da tela  (Lida 5604 vezes)

Leandro José Hermann

  • Novato
  • *
  • Mensagens: 14
    • Email
Menu de itens ocupando 100% da tela
« Online: Fevereiro 14, 2012, 04:04:16 pm »
Boa tarde!

Acredito que a solução seja simples, porém não consegui resolver. Nos menus que criei, todos tem apenas o tamanho tal qual a quantidade de itens deste, porém gostaria que este ocupe 100% da tela (na horizontal), assim como nos menus de exemplo do ScriptCase.

Uma solução alternativa que encontrei é alterar (acrescentar o código) diretamente no fonte no seguinte ponto:

<tr class="scMenuHTableCss">
   <td class="scMenuLine" align="left" valign="top" style="width:100%; height:30;padding: 0">
      <ul id="css3menu1" class="topmenu" style="width:100%">
   </td>
</tr>

Mas fica a pergunta: É possível fazer esta alteração diretamente no ScriptCase, pois deste modo toda vez que o código for gerado, tem-se a necessidade de se fazer esta alteração (na unha...)?

Grato pela atenção de todos!

Leandro José Hermann
« Última modificação: Fevereiro 17, 2012, 03:02:12 pm por leandher »

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #1 Online: Fevereiro 18, 2012, 05:38:55 am »
Também estou precisando desta solução.
George Carvalho
Porto de Galinhas/PE

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #2 Online: Fevereiro 18, 2012, 07:01:42 pm »
leandher,

Utilizo o menu com o tema Modern/Blue, apliquei a alteração sugerida mas não teve o efeito esperado, deve ser por vc utilizar outro tema.

Da para testar com o Modern/Blue?

Obrigado
George Carvalho
Porto de Galinhas/PE

Leandro José Hermann

  • Novato
  • *
  • Mensagens: 14
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #3 Online: Fevereiro 27, 2012, 02:26:10 pm »
George, utilizo também o mesmo tema de menu.

No arquivo menu.php, pesquise por "topmenu", deve estar lá pela linha "2377" no meu caso. deve ter algo parecido com isto:

/* Controle de Target */
function menu_escreveMenu($arr_menu)
{
    $last      = '';
    $itemClass = ' topfirst';
    $subSize   = 2;
    $subCount  = array();
    $tabSpace  = 1;
    $intMult   = 2;
    $aMenuItemList = array();
    foreach ($arr_menu as $ind => $resto)
    {
        $aMenuItemList[] = $resto;
    }
?>
<ul id="css3menu1" class="topmenu">
<?php
    for ($i = 0; $i < sizeof($aMenuItemList); $i++) {
        if (0 == $aMenuItemList[$i]['level']) {
            $last = $aMenuItemList[$i]['id'];
        }
    }
    for ($i = 0; $i < sizeof($aMenuItemList); $i++) {
        if ($last == $aMenuItemList[$i]['id']) {
            $itemClass = ' toplast';
        }
        $htmlClass = '';
        if (0 == $aMenuItemList[$i]['level']) {
            $htmlClass = ' class="topmenu' . $itemClass;
            if ($aMenuItemList[$i + 1] && $aMenuItemList[$i]['level'] < $aMenuItemList[$i + 1]['level']) {
                $htmlClass .= ' toproot';
            }
            $htmlClass .= '"';
        }
?>

altere a linha marcada para:

<ul id="css3menu1" class="topmenu" style="width:100%">

O texto que apresentei anteriormente é somente a saía em html, apresentada no browser.

Leandro José Hermann

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #4 Online: Fevereiro 27, 2012, 04:55:47 pm »
Obrigado Leandro, vou testar.
George Carvalho
Porto de Galinhas/PE

Leandro José Hermann

  • Novato
  • *
  • Mensagens: 14
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #5 Online: Março 01, 2012, 11:50:55 pm »
Após vários testes, cheguei a uma solução, digamos "definitiva", então ai vai:
No evento onApplicationInit do menu adicione o seguinte código:

echo "<style type=\"text/css\">
ul#css3menu1.topmenu
{
       width: 99.5%;
}
</style>";

Deste modo não necessitando mais a alteração a cada vez que o código é gerado. Não sei dizer ao certo se todo o menu gerado pelo scriptcase tenha o 'id' "css3menu1" e/ou o 'class' "topmenu", assim havendo, a necessidade de se verificar este ponto.

Grato pela atenção de todos!

Leandro José Hermann

jovitomelo

  • Global Moderator
  • Expert
  • *****
  • Mensagens: 916
    • Simples Assim
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #6 Online: Março 02, 2012, 12:12:23 am »
Leandro,

Valeu a dica... muito bom, parabéns!!!!

Abraço.
Jovito Melo
Maceió - Alagoas

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #7 Online: Março 02, 2012, 05:08:46 am »
Leandro,

Ficou perfeito, parabéns e obrigado.
George Carvalho
Porto de Galinhas/PE

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #8 Online: Março 02, 2012, 05:50:42 am »
Leandro,

No Chrome funciona perfeito, no IE9 os sub-menus deixam de ser exibidos.
George Carvalho
Porto de Galinhas/PE

Agostinho

  • Avançado
  • ****
  • Mensagens: 277
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #9 Online: Março 02, 2012, 08:50:02 am »
Qual tema vocês usaram para funcionar 100%, o meu aqui não deu certo, to usando o Android/Blue

Cleyton Euler

  • Expert
  • *****
  • Mensagens: 1149
    • Associação de Usuários Scriptcase
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #10 Online: Março 02, 2012, 10:21:37 am »
Após vários testes, cheguei a uma solução, digamos "definitiva", então ai vai:
No evento onApplicationInit do menu adicione o seguinte código:

echo "<style type=\"text/css\">
ul#css3menu1.topmenu
{
       width: 99.5%;
}
</style>";

Deste modo não necessitando mais a alteração a cada vez que o código é gerado. Não sei dizer ao certo se todo o menu gerado pelo scriptcase tenha o 'id' "css3menu1" e/ou o 'class' "topmenu", assim havendo, a necessidade de se verificar este ponto.

Grato pela atenção de todos!

Leandro José Hermann

Boa Leandro.
Associação de Usuários Scriptcase
http://www.auscriptcase.com.br

Consultoria Scriptcase Versão 5
http://www.infinitusweb.com.br

jovitomelo

  • Global Moderator
  • Expert
  • *****
  • Mensagens: 916
    • Simples Assim
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #11 Online: Março 02, 2012, 01:36:19 pm »
Pessoal,

Também acabei de fazer testes com o IE9 e os sub-itens dos menus não aparecem.... mas não deixou de ser interessante.

Abraço.
Jovito Melo
Maceió - Alagoas

Leandro José Hermann

  • Novato
  • *
  • Mensagens: 14
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #12 Online: Março 04, 2012, 11:41:43 pm »
Boa Noite!

Demorei um pouco para responder, mas..., por não ter me dado por satisfeito fiz diversas tentativas, todas sem sucesso. Mesmo assim não desistindo, busquei outros caminhos, haja vista que em determinado ponto resolvi utilizar um --echo "<style type=\"text/css\"></style>";-- sem conteúdo, apenas as tag's e para meu espanto não funcionou, o menu continuou não sendo exibido corretamente no IE9. Pois bem, pus-me a pensar... o problema não estava nos comando em si, mas, talvez, na posição ou forma em que estes eram inseridos na página pelo ScriptCase, bom, no Firefox eu utilizo o "Firebug" para vascular o código HTML gerado, bem como, o CSS, Script, etc... no IE9 tem uma ferramenta que pode ser iniciada pelo F12, ou no menu ferramentas chamada "developer tools" ferramentas para desenvolvedores, que me provê funcionalidades semelhantes. A partir desta ferramenta é que percebi aonde estava acontecento o problema...

Encurtando um pouco as coisas, quando utilizamos este pequeno script (anteriormente citado), o IE9 abre a página no modo "Quirks" e não no modo "Standards", ou seja, ele abre a página no modo de retro-compatibilidade (para que seja compatível com versões antigas do IE, basicamente diferenças de rederização), pois a princípio, o código é inserido antes da declaração "<!Doctype" (acredito que esta seja a causa), quando a ferramenta para desenvolvedores está aberta na aba Script o "script" utilizado aparece antes do Doctype, mas na aba HTML o "script" inserido aparece dentro da tag <HEAD> e o Doctype aparece "<-- Doctype" comentado. Por isso acredito que ele esteja entrando no modo Quirks.

Para testarem o menu no IE9 abram a "ferramenta para desenvolvedores" e em: Modo do documento deve estar Quirks, mudem para IE9 Standards (a página sera recarregada novamente) e vejam que o menu estará funcional de novo, e ocupando 100% da tela... Agora ainda não sei como contornar os porques, como por exemplo fazer com que ele entre mesmo assim no modo Standards, mas estamos ai...


Grato pela atenção de todos...

Leandro José Hermann

Leandro José Hermann

  • Novato
  • *
  • Mensagens: 14
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #13 Online: Março 06, 2012, 03:40:40 pm »
Boa tarde!

Seguindo a partir da ideia de que, o código inserido no evento onApplicationInit do menu, causa o erro no IE9 por este fazer com que a declaração do "Doctype" seja comentada e por isso abrir a página no modo "Quirks" e, em resumo, os sub-menus não funcionarem.

Para fazer funcionar, em teoria, deveria o código ser inserido após o inicio do carregamento da página. Deste modo, busquei um outro ponto para inserir o código, bom, ai vai...

Na guia Layout do menu, na opção cabeçalho e rodapé, habilitei a exibição do rodapé e, por exemplo na variável "NM_FOOTER_TITLE" ou outra qualquer, defini o tipo para "valor" e inseri o seguinte código:

<style type=\"text/css\">ul#css3menu1.topmenu{width: 99.5%;}</style>

Bom, para mim funcionou no IE9, porém no "ambiente de desenvolvimento" na variável que eu utilizei o campo apresenta um texto diferente após a geração e execução do menu, mas mesmo após outras alterações no menu, a princípio continua funcionando.

O tema do menu utilizado foi o "Modern/Blue', testei com o Android/Blue, funciona mas, será necessário mais testes, pois este somente a borda e o background se extendem, a cor de fundo dos itens não se expande. Provavelmente é necessário definir mais alguma propriedade CSS.

Grato pela atenção!

Leandro José Hermann

George Carvalho

  • Expert
  • *****
  • Mensagens: 1373
    • Email
Re:Menu de itens ocupando 100% da tela
« Responder #14 Online: Março 06, 2012, 10:26:59 pm »
Testei no ambiente de desenvolvimento e funcionou perfeito no IE9 e Chrome.

Parabéns
George Carvalho
Porto de Galinhas/PE