Eu o Mister HTML !!! Postado Maio 8, 2007 Denunciar Share Postado Maio 8, 2007 <body onload="altTab(0)" style="margin: 0; padding: 0"><table cellspacing="1" cellpadding="0" width="100%" height="22"><tr><td class="focused" id="pt" onclick="altTab(0)" onmouseover="hoverClass('hovered',0)" onmouseout="hoverClass('blured',0)">ABA 1</td><td class="blured" id="pt" onclick="altTab(1)" onmouseover="hoverClass('hovered',1)" onmouseout="hoverClass('blured',1)">ABA 2</td><td class="blured" id="pt" onclick="altTab(2)" onmouseover="hoverClass('hovered',2)" onmouseout="hoverClass('blured',2)">ABA 3</td><td class="blured" id="pt" onclick="altTab(3)" onmouseover="hoverClass('hovered',3)" onmouseout="hoverClass('blured',3)">ABA 4</td></tr></table><style>.focused {color: white; background: red; font-size: 8pt; font-fanily: verdana; cursor: default}.blured {color: white; background: green; font-size: 8pt; font-fanily: verdana; cursor: default}.hovered {color: white; background: blue; font-size: 8pt; font-fanily: verdana; cursor: default}</style><script>function altTab(indexObj){for (x=0;x<document.getElementsByName('ct').length;x++){document.getElementsByName('ct')[x].style.display='none'}for (x=0;x<document.getElementsByName('pt').length;x++){document.getElementsByName('pt')[x].className='blured'}document.getElementsByName('ct')[indexObj].style.display='block'document.getElementsByName('pt')[indexObj].className='focused'}function hoverClass(statusTab, indexTab){if (document.getElementsByName('pt')[indexTab].className=="focused"){return false}else {document.getElementsByName('pt')[indexTab].className=statusTab}}</script><div id="ct">AQUI ESTÁ O TEXTO DA ABA 1</div><div id="ct">AQUI ESTÁ O TEXTO DA ABA 2</div><div id="ct">AQUI ESTÁ O TEXTO DA ABA 3</div><div id="ct">AQUI ESTÁ O TEXTO DA ABA 4</div>Esse script é uma versão simplificada do script do tenko.desculpe por repetir,mas é por que o anterior tinha um erro de digitação e não dava para modificar.Use a vontade no seu site Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Yugi Moto Postado Setembro 11, 2007 Denunciar Share Postado Setembro 11, 2007 Sua ideia de simplificar foi boa...mas você viu o resultado no firefox e Opera ? Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Eu o Mister HTML !!! Postado Dezembro 23, 2007 Autor Denunciar Share Postado Dezembro 23, 2007 Fiz o teste hoje nos seguintes navegadores:Internet Explorer 7 (Microsoft)Firefox 2 (Mozilla)Opera 9 (Opera software)Avant Browser 11 (Avant)Navigator 9 (Netscape)Safari 3 beta (Apple)O exemplo acima lamentavelmente só funcionou no Internet Explorer, no Opera e no Avant Browser (o último, uma verdadeira cópia do IE). Futuramente, se os desenvolvedores dos navegadores que foram reprovados no teste (Mozilla Firefox, Netscape Navigator e Apple Safari) improvisar o modo que os seus produtos são capazes de disseminar o código JAVASCRIPT, no futuro, talvez seje possível exibir o código em todos os navegadores Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Guest leonardolscl Postado Junho 11, 2008 Denunciar Share Postado Junho 11, 2008 Fiz o teste hoje nos seguintes navegadores:Internet Explorer 7 (Microsoft)Firefox 2 (Mozilla)Opera 9 (Opera software)Avant Browser 11 (Avant)Navigator 9 (Netscape)Safari 3 beta (Apple)O exemplo acima lamentavelmente só funcionou no Internet Explorer, no Opera e no Avant Browser (o último, uma verdadeira cópia do IE). Futuramente, se os desenvolvedores dos navegadores que foram reprovados no teste (Mozilla Firefox, Netscape Navigator e Apple Safari) improvisar o modo que os seus produtos são capazes de disseminar o código JAVASCRIPT, no futuro, talvez seje possível exibir o código em todos os navegadoresparece dificil... mais utilizando o Visual Studio é só clicar e arrastar!! rs... Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 KaKarotto Postado Junho 13, 2008 Denunciar Share Postado Junho 13, 2008 O exemplo acima lamentavelmente só funcionou no Internet Explorer, no Opera e no Avant Browser (o último, uma verdadeira cópia do IE). Futuramente, se os desenvolvedores dos navegadores que foram reprovados no teste (Mozilla Firefox, Netscape Navigator e Apple Safari) improvisar o modo que os seus produtos são capazes de disseminar o código JAVASCRIPT, no futuro, talvez seje possível exibir o código em todos os navegadoresPois é...mas nós como bons programadores e desenvolvedores precisamos fazer a nossa parte. Pra falar a verdade eu fico espantado em saber que o código funcionou.Problemas:1- Pra variar usando tabelas onde não é necessário. Em pleno 2008, o conceito tableless já deveria estar completamente incorporado nas nossas mentes.2- document.getElementsByName, raramente é usada. Só é usada para navegadores muito, muito antigos. O método pega pelo nome, e não há nenhum elemento html com "name" definido. Daí minha surpresa em saber que funcionou.3- Os id´s dos td´s da tabela tem os mesmos nomes, assim como os divs abaixo da função. Nessa hora é que provavelmente deve dar pau nos navegadores mais recentes. Só pode existir 1 nome id para cada elemento, numa validação html, xhtml, essa parte com certeza falharia.Colocar muitos atributos e eventos javascript no html também não é uma boa prática, é aceitável quando não tem outra opção ou quando se usa em menor quantidade. Não é o caso desse código.Mister, apesar da intenção ser muito boa, o raciocinio estar em grande parte correto, precisamos tomar cuidado na hora de codificar, pra não termos que botar a culpa nos coitados dos navegadores. Eles tem suas falhas mas, temos que fazer a nossa parte também né ;) Vou tentar fazer uma versão menos obstrutiva e mais tableless das abas se me permitirem, pra ser mais didático e pra mostrar o que eu estou querendo dizer. Tomara que eu tenha conseguido expor minhas críticas construtivamente e espero que continue postando suas dicas, o fórum precisa de pessoas como vocês que ajudam.Aquele abraço. Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
Eu o Mister HTML !!!
Esse script é uma versão simplificada do script do tenko.desculpe por repetir,mas é por que o anterior tinha um erro de digitação e não dava para modificar.Use a vontade no seu site
Link para o comentário
Compartilhar em outros sites
4 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.