Stylechanger v.0.1
angenommen man hat sowas:
<ul id="parentid">
<li>Hallo</li>
<li>Nochwas</li>
<li>Und Nochwas</li>
</ul>
und das will man jetzt nicht untereinander, sondern nebeneinander darstellen, das geht ja mit display:inline;
aber angenommen, man möchte dies nun dynamisch machen
d.h. der User kann auf einen link klicken und dann wird es horizontal angezeigt und dann klickt er auf einen anderen, und dann ändert das wieder.
<script type="text/javascript">
function displayChange(parentid,display) {
names = document.getElementsByTagName('li';
for(i = 0; i < names.length; i++) {
//alert(names[i].parentNode.id);
if(names[i].parentNode.id == parentid) {
names[i].style.display=display;
}
}
}
</script>
<ul id="parentid">
<li>Test</li>
<li>och ein Test</li>
</ul>
<a onclick="displayChange('parentid','inline';" href="#">Zu
einer Zeile</a>
<a onclick="displayChange('parentid','list-item';" href="#">Zu Block element</a>
Demo:
http://scripts.moonsword.info/homes/guest/JavaScript/displayChange.html
wie man das ganze benutzt sollte klar sein:
displayChange(<parentid>,<new display>