Ihre Problembeschreibung ist ziemlich unklar.
Entschuldigung, muss ich sagen.
ich kann nicht herausfinden, was diese Klassen sind für:
Aber ich fand über .glyphicon
aus.
Dies gab mir endlich einen echten Hinweis auf das, was Sie, was zu tun ist:
(Danke, übrigens, mich entdecken zu machen!)
Sie wollen Onclick die Anzeige von li
s hin- und herzuschalten von einem icon..oO (Was noch?)
Und Sie werden wahrscheinlich wollen, es zu schließen, wenn es geöffnet ist.
Also hier ist ein kleines Skript, das zu tun:
$(".glyphicon-folder-open, .glyphicon-folder-close").click(function(){
// Toggle display of folder icons and lis
$(this).parent().children("span.glyphicon, li.tercera").each(function(){
var correctDisplay = "block";
if($(this).hasClass("glyphicon")){ // Icon need to be inline-block
correctDisplay = "inline-block";
}
if($(this).css("display") == "none"){
$(this).css("display",correctDisplay);
}else{
$(this).css("display","none");
}
});
});
Werfen Sie einen Blick auf meine Fiddle arbeiten.
Ich habe ein anderes Glyphicon für den geöffneten Ordner hinzugefügt.
Ich habe auch eine .description
Klasse ... Was vielleicht die Verwendung von .carpeta
war ...
Hier ist Ihre HTML jetzt:
<ul class="segunda">
<span class="glyphicon glyphicon-folder-close"></span>
<span class="glyphicon glyphicon-folder-open"></span>
<span class="description"> Numbers</span>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example 1
</li>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example 2
</li>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example 3
</li>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example 4
</li>
</ul>
<ul class="segunda">
<span class="glyphicon glyphicon-folder-close"></span>
<span class="glyphicon glyphicon-folder-open"></span>
<span class="description"> Letters</span>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example A
</li>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example B
</li>
<li class="tercera">
<span class="glyphicon glyphicon-file"></span>
Example C
</li>
</ul>
<br>
Und einige CSS:
.tercera{
display:none;
}
.glyphicon-folder-open{
display:none;
}
.glyphicon{
padding:6px 6px 0 0;
}
li{
padding:0 0 0 10px;
}
Schlussgedanke über .doc-doc
:
Weil ich das Gefühl, mich haben zu sagen es wird die nächste Frage sein ...
Wenn Sie einen Dokumenten-Gehalt in einem div
irgendwo angezeigt werden soll ... Auf li
Klick:
Geben Sie für Ajax.
Ihr Markup ist ungültig. https://www.w3.org/TR/html5/grouping-content.html#the-ul-element – undefined