Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

erishk

Ampliar detalhes embaixo de um link

Por , em Javascript

Recommended Posts

erishk    0

erishk
Postado

Ae pessoal, para dar umas treinadas to fazendo um site de um clan de um amigo.

 

Fiz a parte de membros dessa forma:

 

http://img484.imageshack.us/img484/9841/sitecdg5az.jpg

 

quem quiser ver vai em http://www.1infcdg.kit.net

 

tipo, quando voce clica no nick da pessoa ou na foto abre um pop up com mais detalhes.

 

ficou beleza e talz, mas que tava querendo fazer uma modificacao porque tem entrado muitos membros

 

queria fazer uma lista normal, so com os nomes, e ae clicando no nick da pessoa, "abriria" embaixo do nick uma tabela com mais dados e continuaria com a mesma coisa depois(de clicar no nick ou foto e abrir mais detalhes) e tipo, a pessoa podendo "abrir" mais de um nick(para se quiser comparar por exemplo) se ser do tipo abriu um o outro fecha saca?

 

tipo essa imagem abaixo

e queria que quando os "detalhes" estivesse aberto o "botao" mostrar detalhes ficasse "invisivel", nao aparecendo.

 

http://img416.imageshack.us/img416/9806/sitecdgmod4mv.jpg

 

 

é dificil fazer isso? alguem poderia me dar uma forca? queria fazer, mas nem sei por onde comecar... (de repente um iframe abaixo de cada nome, abrindo em porcentagens daria certo? flash? help!)

 

acho que se eu fizer um iframe com porcentagem minima embaixo de cada nome e ao clicar no "botao" mais detalhes faca abrir no iframe logo abaixo (exemplo: nick: gejor , iframe:gejor...) dara certo, mas ae nao teria como fazer esse ocultar os dados ne....? ou de repente colocaria o ocultar detalhes como a pagina membros.htm(meio que fazendo um refresh na pagina) é um jeito ne? mas o que eu queria mesmo era alem desse lance de aparecer os detalhes embaixo como an figura 2, eu pudesse ocultar os detalhes e abrir a vontade, ate como forma de poder comparar um ou mais membros.

 

help

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

Exemplo rápido:

 

<HTML><HEAD><TITLE> New Document </TITLE><script LANGUAGE="javascript">//abre e fecha tabelafunction sub1_abre(tabela){	tabela = document.getElementById(tabela);	if(tabela.style.display=="none"){		tabela.style.display="block";	} else {		tabela.style.display="none";	}}</SCRIPT></HEAD><BODY><A HREF="java script:sub1_abre('tabela1');">TITULO</A><BR><div id="tabela1" style="display:none;text-align:justify;">Texto oculto!<br>Texto oculto!<br>Texto oculto!<br>Texto oculto!</div></BODY></HTML>
Retire o espaço de java script!!!

 

B)

opa, valeu ae, mas uma duvidazinhas, voce menciona a retirada do javascrip, qual dos?

e tipo, aonde eu especifico valores de tamanho ta tabela? ou já é "default" em 100% da tabela? tipo, onde tem esse texto oculto seria para eu colocar o q?

 

to mesmo ruim ne, huahua, pow 7 meses sem mexer enferruja!!! :(

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

valeu ae pessoal, vou meter a cara aqui quando tiver um tempo e posto o resultado depois, valeu a atencao

 

 

hum... resolvi fazer agora a pouco e tipo... acho que fiz algo errado

 

<script LANGUAGE="javascript">//abre e fecha tabelafunction sub1_abre(tabela){	tabela = document.getElementById(tabela);	if(tabela.style.display=="none"){		tabela.style.display="block";	} else {		tabela.style.display="none";	}}</SCRIPT><A HREF="membros_teste_doberman.htm" "javascript:sub1_abre('tabela1');">[1Inf-CdG]Doberman</A><BR><div id="tabela1" style="display:none;text-align:justify;">
tipo, abre uma nova janela com o que eu queria que abrisse embaixo... ao inves de "descer" e abrir, abre em uma nova janela

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

não ta faltando codigo???

porque depois do <A HREF="java script:sub1_abre('tabela1');">TITULO</A><BR> nao teria que ter algum codigo entre a tabela?

porque eu fiz aqui e talz e tipo, a tabela carrega quando a pagina carrega... e nao quando clica no link, sera que so funciona com div? ou to fazendo algo errado?

 

Ali é uma DIV! Não trabalhe com tabelas; mude seu layout para Tableless! Mas se ainda preferir tabela, apague de <DIV... até </DIV> e coloque sua tabela lá, com as medidas que quiser...

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

tem alguma forma de mudar automaticamente uns td, tr para div? ou so manualmente?

 

 

tipo, abre uma nova janela com o que eu queria que abrisse embaixo... ao inves de "descer" e abrir, abre em uma nova janela

Você está mandando assim!!! Entenda como funciona!

 

1 - Você carregará todas as informações, no caso aí do [1Inf-CdG]Doberman, ao carregar a página! As informações do perfil dele, que supostamente estariam membros_teste_doberman.htm, têm que estar na mesma página.

2 - Essas informações devem ser carregadas para a tabela onde não será mostrada inicialmente (style="display:none;").

3 - Só serão mostradas ao clicar no link!

 

Tira isso do script: HREF="membros_teste_doberman.htm"

 

:o

 

hm... valeu, tipo, testei aqui, apaguei a div e fiz com tabela mesmo(nao sei como converter automaticamente para div) e nao deu certo nao...

 

emcima ta tudo ok, nao tem o que mexer(no script) mas no "link".

 

 

<td height="128" valign="top"><table cellspacing="0" cellpadding="0" width="102"

align="right" border="0">

<tbody>

<tr>

<td width="102" class="bordasbrancas"><div align="center"><img

src="membros/fotos_membros/doberman.jpg"

width="101" height="101" hspace="0" onclick="MM_openBrWindow('membros/membros_htm/doberman.htm','Doberman','toolbar=yes,location=yes,status=yes,menubar=yes,scrollbars=yes,resizable=yes

,width=780,height=635')" /></div></td>

</tr>

</tbody>

</table>

<div align="center"></div></td>

<td valign="top"><table height="100%" cellspacing="0" cellpadding="0"

width="100%" align="left" border="0">

<tbody>

<tr>

<td class="bordasbrancas" valign="top" height="128"><table width="603"

border="0" align="left" cellpadding="0" cellspacing="0">

<tbody>

<tr>

<td width="180" height="29" bgcolor="#666666" class="direitafundobranco"><div align="left"><span class="style5"><span class="pontilhado"> <span class="style6">::</span> <a href="java script:;" onclick="MM_openBrWindow('membros/membros_htm/doberman.htm','doberman','width=780,height=635')">[1Inf-CdG]Doberman</a></span></span><br />

</div></td>

<td width="12"> </td>

<td width="411"><div align="center" class="style7">

<div align="left"><a target="_blank" href="http://aaotracker.4players.de/usertracker.php?userid=70841"><img border="0" src="http://aaotracker.4players.de/trackericon.php?userid=70841&style=5" /></a></div>

</div></td>

</tr>

<tr>

<td class="estilonome"><div align="right">DISPONIBILIDADE:<br />

</div></td>

<td> </td>

<td class="pontilhado">   2x na semana / 1 hora por dia </td>

</tr>

<tr>

<td class="estilonome"><div align="right">IDADE:</div></td>

<td> </td>

<td class="pontilhado">   27 anos </td>

</tr>

<tr>

<td class="estilonome"><div align="right">JOGA DESDE:</div></td>

<td> </td>

<td class="pontilhado">   v1.1</td>

</tr>

<tr>

<td class="estilonome"><div align="right">MAPAS FAVORITOS:</div></td>

<td> </td>

<td class="pontilhado">   SF CSAR, Pipeline SF, Insurgent Camp </td>

</tr>

</tbody>

</table></td>

</tr>

</tbody>

</table></td>

<A HREF="java script:sub1_abre('tabela1');">[1Inf-CdG]Doberman</A><BR>

Tipo, quando testo no brownser, eu clico no nick doberman ele ate "pisca" e talz como um link, mas nao acontece nada, e tipo, a tabela sempre fica a mostra! a pagina ja carrega mostrando a tabela...

 

se tiver algum jeito de configurar a tabela para div automaticamente, por favor me da um toque que eu faco como voce disse

obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

nenhuma.tipo, meio que deu certo...o tonto aqui esqueceu de unir o java do script (javascript) q você tanto me alertoumas o efeito esta ao contrario!!! O.otipo, a pagina ja carrega a tabela, ae quando eu clico no nick doberman ela desaparece!!!! O.ohuahuau to parecendo um moleque quando ganha um brinquedo, apesar do efeito estar ao contrario, conseguir fazer a parada é realizacao huahua

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

opaaaaaaaaaaaaa, agora funcionou!!!!!! pow, valeu mesmotipo, o local onde deveria aparecer a foto(o td...) nao aparece O.omas so uma duvidazinha, tipo, como eu faco para ocultar?? tipo, colocar uma imagem dentro dessa tabelinha que aparece tipo o botao ocultar detalhes e clicar nele e desaparecer a tabela?tenho que colocar algum style na config da imagem?

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

sakei, na proxima atualizacao vou colocar os creditos da parte dos membros para você :P valeu mesmo pela forcamas tipo, to clicando no mesmo link e ela nao fecha O.oe tipo, so para eu saber de tem como... tipo, to com uma tabela montada, tem algum jeito de substituir automaticamente para div?

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

sakei, mas tipo, to clicando no mesmo link e ela nao fecha O.oSe você estiver usando essa função, tem que fechar:

<script LANGUAGE="javascript">//abre e fecha tabelafunction sub1_abre(tabela){	tabela = document.getElementById(tabela);	if(tabela.style.display=="none"){		tabela.style.display="block";	} else {		tabela.style.display="none";	}}</SCRIPT>
:o exatamente essa, serio mesmo, nao fecha!!!eu ate consertei, repare na linha:if(tabela.style.display=="none"){eu tirei o "=" q a tinha mais :P , fora isso nao mexi em nada! e o lance de converter as tabelas automaticamente para div tem como ou so manualmente mesmo?

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

huahuahuhauhaa!!!!já disse que eu te amo????????putz, valeu mesmo, brigadao!agora so preciso descobrir porque o diabo da tabela com a foto que aparecia antes disso tudo quando eu coloquei a tabela dentro do codigo a foto nao aparece!!! :blink: saca na na segunda foto que postei, a foto do rk? coloquei tudo certim e agora com o codigo ela nao aparece!

Compartilhar este post

Link para o post
Compartilhar em outros sites

JotaPe_sp    0

JotaPe_sp
Postado

Sou bem novo aqui e a dúvida q me fez inscrever-me era de um script muito parecido...

Eu queria chamar essa função no 'onmouseover', mas não queria que no 'onmouseout' ela fosse automaticamente chamada. Queria de demorasse uns segundos. Acabei desistindo (o q é muito feio, mas paciência...)

 

D qualquer jeito, vamo ao assunto: acho q o script pode t ajudar. Essa é a função:

 

<script>function clicar(id){	var elemento = document.getElementById(id);	 	 if(elemento.style.display == "none"){		 elemento.style.display = "inline";	 } else {		 elemento.style.display = "none";	 }}

E, o html ficava assim:

<A href="#" onclick="clicar('anc1')">Menu 1</A><BR>	   <DIV id=anc1 style="DISPLAY: none">			  <a href="link.htm">Submenu1</a><br>			  <a href="link2.htm">Submenu2</a><br>	   </DIV>

No seu caso, você pode incluir a tabela (como se estivesse escrevendo ela normalmente) entre os <div></div>

 

Espero que tenha t ajudado, mesmo tendo ignorado toda a discussão dentro desse tópico.

Compartilhar este post

Link para o post
Compartilhar em outros sites

erishk    0

erishk
Postado

putz, tipo, fiz algo errado??

 

 

 

olha o exemplo

 

http://www.1infcdg.kit.net/editando/membro...tando_teste.htm

 

eu clico em um, beleza, ele abre, quando eu clico no debaixo ele fecha o de cima ao inves de abrir um sozinho!!(deixando o outro aberto ate eu ocultar no link e talz)

 

:blink: http://forum.imasters.com.br/public/style_emoticons/default/blush.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito