Beste SD'ers,

Ik ben momenteel bezig met een website en loop nu tegen een probleem aan waar ik niet uit komt.

Ik heb 2 div's, en standaard wil ik div 1 bij het laden zichtbaar hebben. Vervolgens staat in div 1 een link die verwijst naar div 2. Dan moet div 2 zichtbaar worden maar div 1 onzichtbaar. Vervolgens staat er een link naar div 1 en ga zo maar door.

Ik heb op internet lopen zoeken maar kom er niet uit, ook omdat mijn javascriptskill niet bepaald super zijn. :(

Alvast bedankt voor de reacties!

Code:

<div id="togglers">
   <div id="div1">tekst1<a href="#" rel="div2">link</a></div>
   
   <div id="div2">tekst2<a href="#" rel="div1">link</a></div>
</div>

Bijhorende javascript:

Code:

<script language="javascript">
<!--
window.onload = function () {
    var togglerElements = document.getElementById('togglers').getElementsByTagName('a');
    var contentElements = new Array();
    for (var i = 0; i < togglerElements.length; i++) {
        var togglerElement = togglerElements[i];
        var togglerTarget = togglerElement.getAttribute('rel');
        if (togglerTarget != '') {
            var contentElement = document.getElementById(togglerTarget);
            if (contentElement) {
                contentElements.push(contentElement);
                contentElement.style.display = 'none';
                togglerElement.onclick = function (e) {
                    var event = e || window.event;
                    var target = event.target || event.srcElement;
                    var targetElementId = target.getAttribute('rel');
                    for (var i = 0; i < contentElements.length; i++) {
                        contentElements[i].style.display = 'none';
                    }
                    document.getElementById(targetElementId).style.display = 'block';
                }
            }
        }
    }
}
//-->
</script>

Code:

function voegtoe() {
  var ni = document.getElementById('myDiv');
  var numi = document.getElementById('theValue');
  var num = (document.getElementById('theValue').value -1)+ 2;
  numi.value = num;
  var newdiv = document.createElement('div');
  var divIdName = 'my'+num+'Div';
  var number = 2;
  var tellen = number + num;
  newdiv.setAttribute('id',divIdName);
  newdiv.innerHTML = 'tekst + link getal van de toegevoegde div kan je ophalen met ' + tellen + '';
  ni.appendChild(newdiv);
  document.getElementById("div1leegmken").innerHTML = '';
}

<input type="hidden" value="0" id="theValue" />
<div id="myDiv"> </div>
<a href="" onclick="voegtoe()">link</a>

Hier moet het wel mee lukken

Bedankt, het is me gelukt!