Just nu i M3-nätverket
Gå till innehåll
Lothlórien

Javascript-problem big time

Rekommendera Poster

Jag har tåv script på min hemsida. Ett styr menyn och det andra styr ett enkelt fotoalbum. Det funderade under flera veckor men nu har det hänt nåt som gör att scripten inte gör det de ska. Jag har inte varit inne i scripten och ändrat.

 

Så här ser head ut:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
<meta charset="utf-8">
<title>kyrkoruiner.se</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta name="keywords" content="kyrkoruin, kyrkoruiner,ruin, ruiner, kyrka, kyrkor, gravar, gravstenar, gravhällar, domkyrka, domkyrkor, runor, runstenar">
<link rel="shortcut icon" href="bilder/favicon.ico">

<link href="kyrkomain.css" rel="stylesheet" type="text/css">
<link href="mediaqueries.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="album.js"></script>
<script type="text/javascript" src="meny.js"></script>

</head>

 

javascriptet till menyn:

/* Open when someone clicks on the span element */
function openNav() {
    document.getElementById("myNav").style.width = "100%";
}

/* Close when someone clicks on the "x" symbol inside the overlay */
function closeNav() {
    document.getElementById("myNav").style.width = "0%";
}

 

Och till albumet: 

var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}  

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("demo");
  var captionText = document.getElementById("caption");
  if (n > slides.length) {slideIndex = 1}
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";
  dots[slideIndex-1].className += " active";
  captionText.innerHTML = dots[slideIndex-1].alt;
}}

 

och include/header.php

<div id="header">
    <a href="index.php"><h1>Kyrkoruiner.se</h1></a>

</div>

<div id="header_meny">
    
<div id="menybox">
    
<div id="myNav" class="overlay">
  <a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
  <div class="overlay-content">
    
        <?php include 'meny/meny.php';?>
    
  </div>
</div>

<span style="font-size:30px;cursor:pointer" onclick="openNav()">☰ open</span>
</div>

Kan någon hjälpa mig med mitt problem? Jag är nybörjare på detta så va snälla ;)

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

album.js slänger ett fel om man kollar js-konsollen när sidan laddas. På rad 28 är det en måsvinge för mycket, alltså }} istället för }. Ta bort en av dem och testa igen.

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Tack men det hjälpte inte. Eftersom båda scripten slutade fungera samtidigt känns det som det är nåt annat och inte koden i scripten.. :(

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Om du i din webbläsare trycker F12 och sen försöker köra dina script. Dyker det upp ett felmeddelande i loggen då? Och i så fall, vad säger det.

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser
Postad (redigerade)
På 2018-10-02 på 22:02, skrev Lothlórien:

Tack men det hjälpte inte. Eftersom båda scripten slutade fungera samtidigt känns det som det är nåt annat och inte koden i scripten.. :(

 

Fast om du har syntaxfel i album.js så kan det absolut förhindra att resten av dina script körs.

 

Du har fortfarande fel i album.js, man ser det i js-konsollen när man laddar sidan. Dina slide-element blir inte selectade i showSlides eftersom js-koden körs innan HTML:en har hunnit rendera, är min gissning. Så slides blir undefined och när du försöker ändra style på dem så smäller det.

 

Du måste vänta på att DOM:en är redo innan du kan börja selecta element från den. Du kan lägga en onload-handler runt det första anropet till showSlides som görs vid sidladdning, alltså såhär:

 

window.onload = function() {
  showSlides(slideIndex);
};

 

Redigerad av ChromaWoods
Rättade felaktig kod

Dela detta inlägg


Länk till inlägg
Dela på andra webbplatser

Skapa ett konto eller logga in för att kommentera

Du måste vara medlem för att kunna kommentera

Skapa ett konto

Skapa ett nytt konto på vårt forum. Det är lätt!

Registrera ett nytt konto

Logga in

Redan medlem? Logga in här.

Logga in nu



×