Javascript diaporama tableau numéro

Je suis assez nouveau à Javascript et j'essaie de construire moi-même le diaporama maintenant. Je suis juste coincé maintenant après avoir construit le tableau où je reçois mes photos. Il montre seulement un écran blanc.Javascript diaporama tableau numéro

Mon Javascript

$(function() { 
var counter = 0; 
var defaultSettings = { 
    "sliderContainer": "#slider" 
    , "pauseWithMouse": true 
    , "sliderSpeed": 2000 
    , "transitionSpeed": 1500 
}; 

function cycleImages() { 
    counter++; 
if (counter >= images.Length) { 
    counter = 0; 
} 
document.getElementById("#slider img").src = MyImages[counter]; 

var images = $('#slider img') 
    , now = images.filter(':visible') 
    , next = now.next().length ? now.next() : images.first() 
    , speed = 1500; //Transition speed 
now.fadeOut(speed); 
next.fadeIn(speed); 
} 

var theInterval; // Slide speed 

var = images = []; 
// if myImages exists then 
images = myImages; 
if (images.length > 0) { 
    $(defaultSettings.sliderContainer).append('<img id="sliderImage" src="' + images[0] + '" />'); 
    startSlide(); 
} 
var startSlide = function() { 
    setInterval(cycleImages, defaultSettings.sliderSpeed); // Set interval 
}; 
var stopSlide = function() { 
    if (defaultSettings.pauseWithMouse) { 
     clearInterval(theInterval); 
    } 
}; 
startSlide(); 
$('#slider img').on('mouseover', function() { 
    stopSlide(); 
}); 
$('#slider img').on('mouseout', function() { 
    startSlide(); 
}); 
});

Et mon code HTML:

<!DOCTYPE html> 
<html > 
<head> 
<meta charset="UTF-8"> 
<title>Javascript Slider</title> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
    <link rel="stylesheet" href="css/style.css"> 
    <script src="js/slideshow.js"></script> 

<script> 
    var myImages = ["slide1.jpg", "slide2.jpg", "bg/slide3.jpg"]; 
</script> 
</head> 

<body> 
<main> 
<div id="slider"> 
</div> 
</main> 
</body> 
</html>

Source

2017-06-08 Romeo Immanuel

Pouvez-vous fournir du violon ou un échantillon pour exécuter votre code? – oguzhancerit

oui: https://jsfiddle.net/xr6sfdyj/ –

Ok pas sûr si c'est votre problème, mais vous déclarez 'var images = $ ('# slider img')' et puis comme 4 lignes plus tard, vous déclarez 'var images = [] 'Vouliez-vous dire cela? Et en soulignant l'évidence ici, changez 'var = images = []' en var images = [] ' – jdmdevdotnet

vous avez étrange déclaration de la variable ici

var = images = [];

aussi vous devez déplacer cette partie

var startSlide = function() { 
    setInterval(cycleImages, defaultSettings.sliderSpeed); // Set interval 
};

avant

if (images.length > 0) { 
    $(defaultSettings.sliderContainer).append('<img id="sliderImage" src="' + images[0] + '" />'); 
    startSlide(); 
}

vous avez un mauvais nom de variable (MesImages) ici

document.getElementById("#slider img").src = MyImages[counter];

d'abord essayer de Déboguer votre code

Source

2017-06-08 14:08:05

Il est impossible pour aucun d'entre nous de répondre car l'OP a 2 var nommées 'images' et nous n'avons aucune idée de ce que var hes essaie de faire référence à n'importe quelle partie du code. Il y a de nombreux problèmes avec le code, et avant qu'il ne répare le problème de 2 'images', nous ne pouvons pas avoir une idée de comment réparer le reste du code. – jdmdevdotnet

premières var images est à l'intérieur de la fonction je pense qu'il ne sera pas en conflit Je pense auteur peut appuyer sur F12 et voir quelles erreurs il reçoit dans la console –

Console dit: Uncaught TypeError: Impossible de lire la propriété 'Longueur' de indéfini à CycleImages –

Javascript diaporama tableau numéro

Répondre

Questions connexes