how to include java script when you have ajax and css?

Question

when I run my javascript in my index.html it works properly but I wanted to seperate it as a js file so I created aram.js and then I added my code to it I also included this line to index:

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

aram.js:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

            $(function() {
                $('#accordion > li').hover(
                    function () {
                        var $this = $(this);
                        $this.stop().animate({'width':'480px'},500);
                        $('.heading',$this).stop(true,true).fadeOut();
                        $('.bgDescription',$this).stop(true,true).slideDown(500);
                        $('.description',$this).stop(true,true).fadeIn();
                    },
                    function () {
                        var $this = $(this);
                        $this.stop().animate({'width':'115px'},1000);
                        $('.heading',$this).stop(true,true).fadeIn();
                        $('.description',$this).stop(true,true).fadeOut(500);
                        $('.bgDescription',$this).stop(true,true).slideUp(700);
                    }
                );
            });

I think the problem is that It can't find the css I have style.css in a css folder which is included in index.html like this line:

  <link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>

Including a <script> tag in your JS file is a problem...

JamesHalsall
– JamesHalsall

2012-08-08 18:39:26 +00:00
Commented Aug 8, 2012 at 18:39 — JamesHalsall
– JamesHalsall, Commented Aug 8, 2012 at 18:39

edhedges · Accepted Answer · 2012-08-08 18:40:04Z

3

You need to have the script tag to include jquery above your javascript include file. These two includes should be in your html.

Like this:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="aram.js"></script>

This will then load jquery first so your javascript (which uses jquery) can be executed.

answered Aug 8, 2012 at 18:40

edhedges

2,7282 gold badges31 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

sedran · Accepted Answer · 2012-08-08 18:39:57Z

2

you can't write tag inside a .js file. you should call jquery inside index.html, too.

answered Aug 8, 2012 at 18:39

sedran

3,5763 gold badges26 silver badges41 bronze badges

Comments

Austin · Accepted Answer · 2012-08-08 18:39:02Z

1

You do not need to wrap your js in <script> tags if it is in a .js file.

Also, you cannot use html tags in your javascript file. This script tag belongs on your html file, ordered like so:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="aram.js"></script>

JS files have only js

answered Aug 8, 2012 at 18:39

Austin

6,0442 gold badges26 silver badges24 bronze badges

Comments

Samuel Edwin Ward · Accepted Answer · 2012-08-08 18:46:27Z

1

Traditionally you would reference both the jQuery javascript file and your own javascript file from the HTML file. Putting an HTML script tag inside your javascript file is not going to work correctly.

If you really want to only include one script element in the HTML file, it should be possible to use this code to inject the jquery code from that file:

document.write('<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>');

However, this technique does not have much to recommend it in this case.

answered Aug 8, 2012 at 18:46

Samuel Edwin Ward

6,6953 gold badges38 silver badges63 bronze badges

3 Comments

Samuel Edwin Ward Over a year ago

Oh, I agree, although a situation might arise in which it becomes necessary to do such a thing.

Negin Nicki Over a year ago

I have wordpress and yes you were right I should have wrote the script in the html but in wordpress I think I should have just js files ini js folder so not even 1 script should be in html what should I do?

Samuel Edwin Ward Over a year ago

You'll have to get WordPress to include the script elements in its HTML output somehow. Unfortunately I have no idea what that would be because I don't use it.

Collectives™ on Stack Overflow

how to include java script when you have ajax and css?

4 Answers 4

Comments

Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related