CODEWITHSUNDEEP
jqueryhtml
Jose Ramon
Jose Ramon

Reputation: 5344

Import several js files in html code

I ve just begin with Jquery, i ve import the jquery file src="http://code.jquery.com/jquery-latest.min.js in my html file. I want to import also other functions that i ve created in the same file. How is this possible to import several js files? For example i want to seperate ready from html file to a new js file:

enter <!DOCTYPE html>
      <html>
      <head>

      <link rel="stylesheet" type="text/css" href="site.css" />
      <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">                                          
      </script>

      </head>

      <body>

   <h1><b> TWEET PEAK  </b></h1>
   <a class="button_example button_about" href=" menu.html">    </a>

   <img src="http://i1061.photobucket.com/albums/t480/ericqweinstein/elevator.png"/> 

    <script> 
        $(document).ready(function(){

        $('img').animate({top:'+=100px'},1000);
    });
</script>

    </body>
    </html>here

Upvotes: 0

Views: 125

Answers (1)

Kai
Kai

Reputation: 46

You'll want to put your JavaScript code in a separate file and link to it using another script tag. For example, if you put your JavaScript in a file called "mycode.js" you would link to it like this:

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

In this example mycode.js would contain:

$(document).ready(function(){

    $('img').animate({top:'+=100px'},1000);
});

Edit, to be more clear:

Here is how I see your example code looking: 

  <link rel="stylesheet" type="text/css" href="site.css" />
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">                                          
  </script>
  <script type="text/javascript" src="mycode.js"></script>
  <style> img { position: relative; } </style>
  </head>

  <body>

<h1><b> TWEET PEAK  </b></h1>
<a class="button_example button_about" href=" menu.html">    </a>

<img src="http://i1061.photobucket.com/albums/t480/ericqweinstein/elevator.png"/> 


</body>
</html>

Upvotes: 3

Related Questions