Chamar link dentro do accordion do JqueryUI

1 resposta
F

Oi gente tudo bem
Estou fazendo um simples página utilizando o recurso de Accordion e Dialog do JqueryUI tentando fazer um efeito parecido com o dessa página
http://wp.nmc.org/horizon2011/sections/game-based-learning

Só que ná página, quando vc clica no accordion(comentário) dentro do Dialog, ele abre o accordion e também movimenta o texto até o paragráfo correspondete ao comentário.

Eu consegui criar o accordion e o Dialog numa boa, porém não estou conseguindo fazer rolar o scroll até o parágrafo quando clico no comentario correspondente

Até tentei criar para ver se linkava corretamente, mas não funcionou, alguém tem ideia de como posso fazer isso para imitar o comportamento do referido site acima?

<div id="texto_um">
	Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)
</div>
<div id="texto_dois">
	Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)
</div>		
<div id="texto_tres">
	Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)
</div>

Dialog com accordion

<div id="dialog" title="Dialog Title">			
			<div id="accordion">
			    <h3><a href="#texto_um">First header</a></h3>
			    <div class="conteudo_dialogo">First content</div>
...

1 Resposta

thiagof

O que você quer é algo chamado de Ancora em HTML

dá uma olhada nesses links, lá eles explicam de forma didática como utilizar as ancoras em uma pagina html

[url]http://www.codigofonte.net/dicas/html/29_criando-ancoras-em-suas-paginas[/url]

[url]http://www.htmlstaff.org/ver.php?id=1297[/url]

seu html está quase certo, só troque o atributo ID por NAME nas divs, assim:
<div name="texto_um">  
    Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)  
</div>  
<div name="texto_dois">  
    Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)  
</div>          
<div name="texto_tres">  
    Ut, diam? Vut mus, pid dictumst elementum mauris ......(muito mais texto)  
</div>
desse jeito é para funcionar!
Criado 11 de abril de 2012
Ultima resposta 16 de abr. de 2012
Respostas 1
Participantes 2