Português
Para ajudar um amigo, escrevi algumas guias simples e as dediquei aos amigos necessitados. 1) Chame vários pontos
<html> <head> <style> body { text-align:center } .tab { width:432px; } .menu,.menu li { margin:0; .menu .default { largura:84px; float:left; tamanho da fonte:10pt;margem-esquerda:1px; ativo {largura:84px;float:esquerda;tamanho da fonte:10pt;altura da linha:1.5;cursor:ponteiro;cor da fonte:#FFFFFF; não-repetição; } #mais { largura:76px; tamanho da fonte:10pt; altura da linha:1.5; -align:right } .con { width:422px; height:184px; margin:0 auto; </style> <head> <body> <script> function init(ids,cons,dis){ document.getElementById(ids .getElementsByTagName('li')[0].className='active'; document.getElementById(cons).innerHTML=document.getElementById(dis+"l1").innerHTML; // document.getElementById(ids).onmouseover= function(){onmousOver(ids,cons,dis);}//O ponteiro do mouse aciona o efeito document.getElementById(ids).onclick=function(){onmousOver(ids,cons,dis);}//O clique aciona o efeito} função onmousOver(ids,cons,dis){ o = o || window.event;| o.srcElement if (obj.tagName=='LI'){ if (obj. className==' ativo'||obj.id=='mais')return; var o=document.getElementById(ids).getElementsByTagName('li'); 1;i++) {o[i].className='default'} obj.className='ativo'; if (obj.className=='ativo'){document.getElementById(cons).innerHTML=document.getElementById(dis +obj.id ).innerHTML;} } } </script> <!--#1--> <div class='tab'> <ul id='nav1' class='menu'> <li id=" l1" class= 'default'>Primeiras notícias</li> <li id="l2" class='default'>Segundas notícias</li> <li id="l3" class='default'>Terceiras notícias</ li > <li id="l4" class='default'>A Quarta Notícias</li> <li id="l5" class='default'>A Quinta Notícias</li> </ul> <div class= ' con' id='con1'> </div> </div> <div style="display:none"> <div id="div1_l1"> <span>Estou procurando uma aba no fórum para um muito tempo. Não existe um efeito ideal</span> </div> <div id="div1_l2"> <span>Então estou aqui para pedir ajuda aos especialistas! </span> </div> <div id="div1_l3"> <span>Encontrei alguns para alterar, mas o menu no cabeçalho é muito difícil de localizar </span> </div> <div id=. " div1_l4"> <span> Ele mudará quando o mouse for colocado sobre ele, não há necessidade de clicar! </span> </div> <div id="div1_l5"> <span>Adicionado! </span> </div> </div> <script> init('nav1','con1',"div1_"); > <ul id='nav2' class='menu'> <li id="l1" class='default'>Primeiras notícias</li> <li id="l2" class='default'>Segundas notícias </ li> <li id="l3" class='default'>A Terceira Notícias</li> <li id="l4" class='default'>A Quarta Notícias</li> <li id="more "> <a href="#" target=_blank>Mais>></a></li> </ul> <div class='con' id='con2'> </div> </div> <div style ="display:none"> <div id="div2_l1"> <span>Quero fazer uma aba, mas estou procurando há muito tempo no fórum sem o efeito ideal</span> </div > <div id= "div2_l2"> <span>Então estou aqui para pedir aos especialistas, por favor me ajudem! </span> </div> <div id="div2_l3"> <span>Encontrei alguns para alterar, mas o menu no cabeçalho é muito difícil de localizar </span> </div> <div id=. " div2_l4"> <span> Ele mudará quando o mouse for colocado sobre ele, sem clicar! </span> </div> </div> <script> init('nav2','con2',"div2_"); > <ul id='nav3' class='menu'> <li id="l1" class='default'>Primeiras notícias</li> <li id="l2" class='default'>Segundas notícias </ li> <li id="l3" class='default'>Terceira notícia</li> <li id="more" style="width:160px"><a href="#" target=_blank> Mais>> </a></li> </ul> <div class='con' id='con3'> </div> </div> <div style="display:none"> <div id ="div3_l1" > <span>Quero fazer uma aba, mas estou procurando ela no fórum há muito tempo sem o efeito ideal</span> </div> <div id="div3_l2"> <span>Então eu estou aqui para perguntar aos especialistas. Olá pessoal, por favor ajudem! </span> </div> <div id="div3_l3"> <span>Encontrei alguns para alterar, mas o menu no cabeçalho é muito difícil de localizar </span> </div> </div>. < script> init('nav3','con3',"div3_");