* Korzystanie z JavaScript, Zaimplementuj przeglądarkę pokazu slajdów z następującymi wymaganiami:

  • Nazwij stronę HTML jako zdjęciaLidessow.html i odpowiednie javascript jako wyniki dla "LIdess.js.js.

  • Pokaz slajdów powinien składać się z 5 różnych obrazów.

  • Po kliknięciu przycisku można wyświetlić inne zdjęcie wybrane w Losowo Strona internetowa.

Mam część skryptu, ale nie mogę dowiedzieć się, jak faktycznie utworzyć pokaz slajdów z losowym przyciskiem.

To jest to, co mam dla JavaScript:

var image1=New Image()
image1.src="image1.jpg"

var image2=New Image()
image1.src="image2.jpg"

var image3=New Image()
image1.src="image3.jpg"

var image4=New Image()
image1.src="image4.jpg"

var image5=New Image()
image1.src="image5.jpg"

I tak wygląda część HTML:

<html>
    <head>
    </head>
    <body>
        <script type="text/Javascript" src="imageSlideShow.js"></script>
        <img src="image1.jpg" name="slide1">
        <br>
        <br>
        <button type="button" value="random" onclick="slideshow()" >Random Image</button>
    </body>
</html>
0
NatJohns 25 listopad 2013, 02:12

2 odpowiedzi

Najlepsza odpowiedź

To nie jest pokaz slajdów, to tylko obraz i zmienisz źródło losowo przy każdym kliknięciu przycisku (wywołanie funkcji JavaScript).

Moją sugestią jest użycie JavaScript, aby wygenerować losową liczbę między 1 a 5. coś w ten sposób:

HTML:

<img src="" id="image">

JavaScript:

function buttonClicked() {
    var randomNumber = Math.floor((Math.random()*5)+1);
    document.getElementById("image").src="image"+randomNumber+".jpg";
}

Math.floor((Math.random()*5)+1) Generuje liczbę losową od 1 do 5. stąd, document.getElementById używa randomNumber, aby wygenerować część adresu URL źródła elementu. Co się kończysz, to źródło obrazu, które zależy od liczby od 1 do 5, które wygenerowałeś losowo.

0
Charles 24 listopad 2013, 22:19

Możesz randomizować swoje obrazy za pomocą tego:

   function shuffle(o){ //v1.0
        for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
        return o;
    };

var imgs ["image1.jpg","image2.jpg","image3.jpg","image4.jpg","image5.jpg"];

imgs = shuffle(imgs);

var pos = 0;

slideshow(){
   image1.src=imgs[pos];
   pos = (pos+1)%imgs.length;
}

Jest to podstawowy pomysł, możesz dostosować ten skrypt do swoich potrzeb.

0
Victor Ribeiro da Silva Eloy 24 listopad 2013, 22:20