treeview html

[ferreira12]

Boas,

é possivel fazer um genero de um treeview em htlm puro...

Já pesquisei um pouco e não encontrei nada...

Alguem me consegue ajudar.

Obrigado

[HappyHippyHippo]

sem Javascript é impossível

com HTML+CSS é possível fazer algo parecido mas a árvore iria colapsar-se no momento que o rato saisse da área do treeview

[ferreira12]

consegues me mostrar um exemplo?

qual é a minha ideia...

+Portugal

+Norte

+Porto

+Gaia

+Centro

+Sul

a ideia era eu ir abrindo...Portugal...

[NunoDinis]

tens aqui exemplos.

[I-NOZex]

@hippo, pelos vistos ate é possivel (para minha surpresa tambem)

em html+css puro

http://www.thecssninja.com/css/css-tree-menu

http://acidmartin.wordpress.com/2011/09/26/css3-treevew-no-javascript/

Edited October 17, 2013 at 11:33 AM by I-NOZex

[taviroquai]

Ve la se isto te serve... o javascript é mínimo...

<script type="text/javascript">
function toggle(me) {
var el = me.parentNode.getElementsByTagName('UL')[0];
   if (!el.style) el.style = {};
if (el.style.display == 'block') el.style.display = 'none';
else el.style.display = 'block';
}
</script>
<ul>
<li>
	<a href="#" onclick="toggle(this)">Pai1</a>
	<ul style="display: none">
		<li>
			<a href="#"  onclick="toggle(this)">Pai2</a>
			<ul style="display: none">
				<li>Folha</li>
			</ul>
		</li>
	</ul>
</li>
</ul>

@I-Nozex

Boa boa o truque de mudar o css com base no estado da checkbox... 😛

[HappyHippyHippo]

@hippo, pelos vistos ate é possivel (para minha surpresa tambem)

em html+css puro

http://www.thecssninja.com/css/css-tree-menu

http://acidmartin.wordpress.com/2011/09/26/css3-treevew-no-javascript/

que grande marosca a usar os checkboxes ... bem ... é preciso ter uma imaginação do camandro ...

parabens a quem teve a ideia (seja lá quem for)

[ferreira12]

taviroquai, com a teu codigo só aperece o primeiro nivel, nao desce pros restantes. clico e nao faz nada,

eu tou a usar a framework do joomla e queria colocar isto num artigo em html...

[I-NOZex]

que grande marosca a usar os checkboxes ... bem ... é preciso ter uma imaginação do camandro ...

parabens a quem teve a ideia (seja lá quem for)

podes crer, ha qem domine bem a coisa 😄

do que vi, chrome e firefox suporta nas primeiras versoes, ie é que é sempre o bastardo, so apartir do 9... opera tbm tem bom suporte

[taviroquai]

@ferreira2012

Provavelmente por omissao nao podes usar javascript no corpo dos artigos... pesquisa como é que o Joomla deixa usar Javascript nos artigos... o que provavelmente deve ter a haver com as tags html permitidas no editor...

@I-NOZex

Mesmo assim em termos de acessibilidade, eu retirava aquele monte de css e deixava uma coisa mais limpa... tipo:

<ul>
<li>
	<a href="#">Pai</a><span>Ver mais...</span><input type="checkbox" />
	<ul class="marosca">
		<li>Filho...</li>
	</ul>
</li>
</ul>

Edited October 17, 2013 at 04:43 PM by taviroquai