Lightbox

Her kan du få hjælp og stille spørgsmål til JavaScript!
Besvar
JvdB100
Begynder
Indlæg: 18
Tilmeldt: 29. mar 2016, 15:51

Lightbox

Indlæg af JvdB100 » 21. jul 2016, 20:55

Hej NP,
Jeg er i gang med en lightbox, men den vil ikke rigtigt virke:

JavaScript

Kode: Vælg alt

function showLightbox(name, src, stor){
    document.getElementById("lightboxBG").style.display = "block";
    document.getElementById("lightboxFG").style.display = "block";
    if(stor == "width"){
    var str = document.getElementById("lightboxFoto").innerHTML;
    var res = str.replace(/name/g, name);
      var req = str.replace(/px/g, 350);
      var rew = str.replace(/image/g, src);
      var ree = str.replace(/stor/g, stor);
    document.getElementById("lightboxFoto").innerHTML = res;
      document.getElementById("lightboxFoto").innerHTML = req;
      document.getElementById("lightboxFoto").innerHTML = rew;
      document.getElementById("lightboxFoto").innerHTML = ree;
    }else{
      var str = document.getElementById("lightboxFoto").innerHTML;
    var res = str.replace(/name/g, name);
      var req = str.replace(/px/g, 250);
      var rew = str.replace(/image/g, image);
      var ree = str.replace(/stor/g, stor);
    document.getElementById("lightboxFoto").innerHTML = res;
      document.getElementById("lightboxFoto").innerHTML = req;
      document.getElementById("lightboxFoto").innerHTML = rew;
      document.getElementById("lightboxFoto").innerHTML = ree;
    }
  }
        function hideLightbox(){
    document.getElementById("lightboxBG").style.display = "none";
    document.getElementById("lightboxFG").style.display = "none";
  }
Billede

Kode: Vælg alt

<img src="Tulipaner.jpg" onclick="showLightbox('Tulipaner, Tulipaner.jpg, height')" alt="Tulipaner" height="150"/>
Div

Kode: Vælg alt

<div id="lightboxBG" onclick="hideLightbox()"></div>
      <div id="lightboxFG"><div id="lightboxButtonDiv"><button onclick="hideLightbox()">X</button></div>
      <div id="lightboxFoto">
        <center>
          <h3>name</h3>
          <br/><br/>
          <img src="image" alt="name" stor="px"/>
        </center>
          </div>
      </div>

Besvar