CODEWITHSUNDEEP
javascript
reidjako
reidjako

Reputation: 384

Calling an external js function

<style>
    #container { 
    width: 320px; 
    height: 400px;
    border: 1px solid red;

    }
    #top { 
    width: 320px; 
    height: 80px;
    border: 1px solid blue;

    }
</style>
<script type="text/javascript" src="One.js"> </script>

</head>
<body>

<div id="top">
<button onclick="start()">Start</button>
<button onclick="stop()">Stop</button>
<button onclick="pause()">Pause</button>

</div>


<div style="position: relative;" id="container">

 <canvas id="myCanvas" width="320" height="400" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
    <canvas id="plane" width="320" height="400" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
    <canvas id="buildings" width="320" height="400" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
       <canvas id="cloud" width="320" height="400" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>

    <canvas id="buildings2" width="320" height="400" 
   style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>

 <canvas id="canvas2" width="100" height="100" 
   style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
</div>

So I want to be able to call the start function which will run my canvas animation. My code is fully working when I have the js on the html page. But I can not get it to work when it is as an external script. Thank you

Upvotes: 0

Views: 54

Answers (1)

maikovich
maikovich

Reputation: 378

Put the <script type="text/javascript" src="One.js"> </script> right before the </body> tag. That will help. The DOM has to load before you can run your Javascript file, that's why it's wise to put it at the end, when you are sure that everything has been loaded.

Upvotes: 1

Related Questions