✔ links(sammlung) verändern

A

amd

Grünschnabel
hallo zusammen ich hab' da ein kleines Problemchen:
ich möchte so machen dass durch einen klick auf den Button eine links Sammlung weggeht und andere erscheint. z.B.
Vorher :
<a href=pfad1>link1</a>
<a href=pfad2>link2</a>
<a href=pfad3>link3</a>
nachher:

<a href=pfad4>link4</a>
<a href=pfad5>link5</a>
<a href=pfad6>link6</a>
es wäre nett wenn mir jemand sagt wie ich das auch automatisieren kann (wenn button nich gedrückt wurde dann erscheint 2. sammlung nach zB 20s automatisch)

mfg amd
 
Hallo zusammen, ist denn meine Frage zu schwierig? Oder ist denn das mit js überhaupt nicht realisierbar?:confused:
Ich würde gerne Ihre Meinung dazu lesen …

amd
 
Hi,

da gibt es sicher eine Reihe von Möglichkeiten, hier eine:
HTML: 
<script language="JavaScript" type="text/javascript">
function swapLinks() {
    var div1 = document.getElementById("links1");
    var div2 = document.getElementById("links2");
    var helper = div1.style.display;
    div1.style.display = div2.style.display;
    div2.style.display = helper;
}
</script>
<body onLoad="setTimeout('swapLinks()', 5000)">
<div id="links1" style="display:inline;">
<a href="page1.htm">Link 1</a><br>
<a href="page2.htm">Link 2</a><br>
<a href="page3.htm">Link 3</a><br>
</div>
<div id="links2" style="display:none;">
<a href="page4.htm">Link 4</a><br>
<a href="page5.htm">Link 5</a><br>
<a href="page6.htm">Link 6</a><br>
</div>
<input name="swapthem" type="button" onClick="swapLinks()" value="Wechseln">
</body>

Gruß

P.S.: Manchmal dauert es eben ein wenig, bis jemand Deinen Thread sieht und Zeit zum Antworten hat - gedulde Dich. ;)
.
 
Hi Datic,

danke für den Antwort (Entschuldigung fürs Ungeduld :-( )
ich bastle jetzt ein test für Kinder, und ich möchte deinen Vorschlag für einen 3 dim Array einsetzen. Kannst du mir da am bisschen auf die Sprünge helfen?:confused: (bin noch ein Neuling in js)

Test: Die Kinder sollen aus einem Satz ein falsches Wort rausfischen. Es gibt 4 Aufgaben mit mehreren Sätzen. Jeder Satz soll nach einander eingeblendet werden. Das ganze soll zeitlich erfasst werden(es wird mit VBS gespeichert).

VORSICHT!: in html befindet sich ein VBS der „c:\test.txt“ ablegt wer das nicht möchte (oder will es nachher nicht löschen müssen) möge es einfach aus html ausschneiden.

P.S die Ideen zu Realisierung würde ich gerne annehmen

Mit freundlichen Grüßen

amd
Hier was ich bis jetzt habe
(ist rein experimentelle html…. ):
 

Anhänge

  • start.zip
    1,6 KB · Aufrufe: 12
Hi,

nun, erstens bin ich nicht völlig sicher, was Du erreichen willst und zweitens kann ich Dir hier kein komplettes Script für so einen Test geben (mit Deinem Gerüst konnte ich auf die Schnelle nicht sehr viel anfangen). Ich würde wahrscheinlich mit mehreren Seiten, einem Frameset und einer Datenbank arbeiten - vom Speichern mit VBS halte ich nicht viel.

Wenn Du alle Fragen auf einer Seite anzeigen willst, könnte ein generelles Gerüst so aussehen (dort, wo ich die Alertboxen gesetzt habe, könnten die Zeitvergleiche und das Speichern erledigt werden):
HTML: 
<html>
<head>
<title>Lesertest</title>
<script language="JavaScript" type="text/javascript">
var current = 1; // Aktueller Satz
var maximal = 3; // Anzahl Sätze

function nextOne() {
    for (var i=1; i<= maximal; i++) {
        document.getElementById("satz" + i).style.display = "none";
    }
    if (current < maximal) {
        current ++;
        document.getElementById("satz" + current).style.display = "inline";
    } else {
        alert("FERTIG");
    }
}

function richtig() {
    alert("DAS WORT WAR RICHTIG");
    nextOne();
}

function falsch() {
    alert("DAS WORT WAR FALSCH");
    nextOne();
}
</script>

<style type="text/css">
 a:link { text-decoration:none; font-weight:bold; color:#000000; font-family: Comic Sans MS; font-size: 20px;}
 a:visited { text-decoration:none; font-weight:bold; color:#000000; font-family: Comic Sans MS; font-size: 20px;}
 a:hover { text-decoration:none; font-weight:bold; background-color:#FFF000; font-family: Comic Sans MS; font-size: 20px;}
 a:active { text-decoration:none; font-weight:bold; color:#F00000; font-family: Comic Sans MS; font-size: 20px;}
</style>
</head>

<body>
<div id="satz1" style="display:inline;">
	<a href="javascript:richtig()">Dies</a>
	<a href="javascript:richtig()">ist</a>
	<a href="javascript:richtig()">ein</a>
	<a href="javascript:falsch()">NÖPEL</a>
	<a href="javascript:richtig()">Test</a>
</div>

<div id="satz2" style="display:none;">
	<a href="javascript:richtig()">Die</a>
	<a href="javascript:falsch()">grmpf</a>
	<a href="javascript:richtig()">Welt</a>
	<a href="javascript:richtig()">ist</a>
	<a href="javascript:richtig()">bunt</a>
</div>

<div id="satz3" style="display:none;">
	<a href="javascript:richtig()">Ich</a>
	<a href="javascript:richtig()">mach</a>
	<a href="javascript:richtig()">Dich</a>
	<a href="javascript:falsch()">Krankenhaus!</a>
</div>
</body></html>

Gruß
.
 
Zuletzt bearbeitet:
Hi,

danke für eine schnelle Antwort :) ,

du hast mir echt weiter geholfen, jetzt muss ich nur noch überlegen wie ich es noch in Aufgaben aufteilen kann. Sonnst, ich glaube, wenn ich deine beide Einträge kombiniere dann bekomme ich das was ich brauche:

wenn maxTime erreicht -> dann nächste Aufgabe,
mit dem klick auf weiter -> nächster Satz(weiter -> damit es Korrektur Möglichkeit bleibt)

kleine Frage nur noch wofür ist die Zeile :
document.getElementById("satz" + i).style.display = "none";
ich kann den Sinn nicht erkennen…


mfg amd

P.S.: es muss LEIDER VBS und kein DB sein , weil es MUSS auf JEDE windows maschine (auch ohne Internet) laufen können.(es ist mir eigentlich bewust dass es mit PHP+DB VIEL einfacher wäre ;) )
P.P.S.: zweitens kann ich Dir hier kein komplettes Script für so einen Test geben
kompleten script zu bekommen wäre ja total falsch ;) mit dem Kopf kann man nicht nur essen ;) das problemm bei mir ist nur diese Sache mit einblenden von elementen(sprich erst formular, dann sätze...) auf einen und deselben Seite
 
document.getElementById("satz" + i).style.display = "none";
Zum Vergrößern anklicken....

- mit document.getElementById("bla") bekommst Du einen Verweis auf das Objekt, in diesem Fall das DIV mit dieser ID.

- i wird ja hier von 1 - 3 durchlaufen, also werden nacheinander die DIVs "satz1" - "satz3" angesprochen.

- style.display = "none" unterbindet die Darstellung, das DIV wird also nicht sichtbar.

Gruß
.
 
ah so dieser satz ist fürs ausblenden des vorherigen DIVs zuständig ;-)
jouuuu DANKE SCHÖN, DANKE SCHÖN,DANKE SCHÖN !

gruss amd
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück