ansaurus

Question

jQuery animating background color - not working

Answer 1

A:

Your script tag for the color plugin is misformed:

<script type="text/" src="jquery.color.js"></script>

Should be:

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

Currently it's as if the jQuery.color plugin doesn't exist since it's not being included in the page.

Nick Craver 2010-03-10 18:11:44

Thanks Nick! I fixed that, but it still doesn't seem to work for me. :( Take a closer look at it here if you want to.http://nike1.se/box/

Nike 2010-03-10 18:25:52

Tried your link under firefox + firebug, here's what I get : (the French message means that he fails to download the file )Échec du chargement de la source pour: http://nike1.se/box/jquery-1.4.2.min.js

David V. 2010-03-10 18:41:22

Maybe you should try with <script type="text/javascript" src="/box/jquery.color.js"></script> ( and the same for jquery ) ?

David V. 2010-03-10 18:42:52

@Nike - Try updating your color plug-in for 1.4: http://github.com/jquery/jquery-color

Nick Craver 2010-03-10 18:44:00

Hey David. :) Thanks, but sadly that didn't help either. No difference at all. :/ This is killing me!! :o

Nike 2010-03-10 18:45:22

Oh, sorry. Now after refreshing the page a few times, it works! It is however a bit buggy. Is there an alternative for the color plugin?Thanks a bunch for the help David! :D

Nike 2010-03-10 18:46:24

@Nike - See my comment, grab the new version and give it a test.

Nick Craver 2010-03-10 18:47:24

Actually, it only seems to work when it feels for it. It doesn't work locally, and now when i go back to the page on nike1.se it doesn't work either :S

Nike 2010-03-10 18:49:11

Oh, thanks. I'll try that :)

Nike 2010-03-10 18:49:50

Still no luck :/

Nike 2010-03-10 18:57:23

Looks like you're loading jquery from the root of your website and it's not there, it's in the box subdirectoryyour script tag should have src="/box/jquery..."

David V. 2010-03-10 19:15:10

Yeah, but the index file is located within the box directory. So i'm actually using the right path, which is just the filename in this case. If i would have put the index file in the root directory, i would need to have the "/box/" before the filename. :)index file: http://nike1.se/box/index.htmljquery files: http://nike1.se/box/jquery....js

Nike 2010-03-10 19:29:37

Damn, sorry. You were right david. :)

Nike 2010-03-10 19:35:48

Answer 2

A:

Hate to break it to you, but I copied your exact source code and changed your script links to link directly to your javascripts (ie. <script type="text/javascript" src="http://nike1.se/box/jquery-1.4.2.min.js"></script>), and it works as expected on my machine.

I suspect the problem is with your paths in the statements on your test page:

<script type="text/javascript" src="/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/jquery.color.js"></script>

Your script is actually in the /box subdirectory. Perhaps the source links should be src="query-1.4.2.min.js" or src="/box/jquery-1.4.2.min.js". Or depending on your web server configuration you might need to include the full path like I did or use the BASE element to properly set the base directory of your document.

ghoppe 2010-03-10 19:13:16

that's exactly what I say in the comments above.

David V. 2010-03-10 19:32:53

Sorry, yes david, you were right. But how is this possible? Shouldn't the index file look for the jquery files in the same directory? Like the example i posted below..? And thanks Nick, that version works a lot better. :)

Nike 2010-03-10 19:37:23

No it won't look for the jquery files in the same directory because you started the path with `/` which signifies the root directory.

ghoppe 2010-03-10 19:49:20

Oh, i had no idea! I set the paths to just the filenames now, and it seems to be working fine for me. Thanks for the help guys, appreciate it! :)

Nike 2010-03-10 19:55:45

Answer 3

A:

You have to have a background color already applied to the element before you try to animate on it. Try applying a background color to the element in your css or via your js just before your function call.

Calvin 2010-08-19 15:15:41

ansaurus

tags:

views:

answers:

jQuery animating background color - not working

related questions