Santiya Santiya - 6 months ago 7
Javascript Question

How to call my main function of JS to my html?

I have nested function in function of JavaScript and I want to call it in my main function photoGallery() of my html code, but didn't work. Where I'm wrong ?

JavaScript:

function photoGallery1() {

kartinki = new Array('images/green_salad1.png', 'images/green_salad2.png', 'images/green_salad3.png');
index = 0;

function next() {
index++;
if ( index >= kartinki.length) index = 0;
document.getElementById('image2').src = kartinki[index];
}

function previous() {
index--;
if ( index < 0) index = kartinki.length -1;
document.getElementById('image2').src = kartinki[index];
}

function start() {
index = 0;
document.getElementById('image2').src = kartinki[index];
}
}


The HTML code:

<!Doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width">
<meta charset="utf-8">

<title>The right eating of employed people</title>

<link rel='stylesheet' media='screen and (max-width: 1000px)' href='css/narrow.css'/>
<link rel='stylesheet' media='screen and (min-width: 1001px) and (max-width: 1235px)' href='css/medium.css' />
<link rel='stylesheet' media='screen and (min-width: 1236px)' href='css/wide.css' />
<link rel="stylesheet" href="css/calendarview.css">
<script src="js/photogallery.js"></script>
<script src="js/prototype.js"></script>
<script src="js/calendarview.js"></script>
<script type="text/javascript">
window.onload = function() {
Calendar.setup({
parentElement : 'calendar'
})
window.onload = photoGallery1()
}
</script>

Answer

If I got, you want the 3 functions inside photoGallery1() to be called only when photoGallery1() is called. If it is the point, just call them at the end before to close.

function photoGallery1() {

    kartinki = new Array('images/green_salad1.png', 'images/green_salad2.png', 'images/green_salad3.png');
        index = 0;

    function next() {
        index++;
        if ( index >= kartinki.length) index = 0; 
        document.getElementById('image2').src = kartinki[index];
    }

    function previous() {
        index--;
        if ( index < 0) index = kartinki.length -1; 
        document.getElementById('image2').src = kartinki[index];
    }

    function start() {
        index = 0;  
        document.getElementById('image2').src = kartinki[index];
    }

    next();
    previous();
    start();
}