Help - Search - Members - Calendar
Full Version: GIF File won't animate
HTMLHelp Forums > Web Authoring > Cascading Style Sheets
jond
Hello everyone,
I am brand new to web design and to this forum. I have recently designed a website for my soccer club and I have an icon on the navigation panel on every page of my website (a spinning football).
This is a GIF file which when I preview on the browser through Dreamweaver works perfectly but on-line, the ball does not display on the website. I have uploaded all of the correct files and can't work out why it doesn't work. Please help!!
Incidentally, I have tried to change the size of this and have also tried it as a JPEG without the animation but it still doesn't appear.
Please can someone help me! The site is www.horleyalbionfootball.co.uk .
Thank you in advance of your help.
Best regards

Jon
Darin McGrew
Please do not use "dumbnails". That is, don't take a 1386x1026 photo that weighs in at half a MB and display it with width="130" height="70". Instead, create a 130x70 copy of the image and use that. See also the FAQ entry How can I create a thumbnail image that is linked to the full-sized image?

Your XHTML for the image is
CODE
<img src="file:///C|/Documents and Settings/Jonathan/My Documents/Horley Town 2/soccer-ball-ani.gif" alt=" " width="16" height="16" />
That URL refers to a file on your computer's filesystem. No one else has access to it. You need to change the URL to refer to the image's location on the server, like one of these examples:
CODE
<img src="http://www.horleyalbionfootball.co.uk/soccer-ball-ani.gif" alt=" " width="16" height="16" />
<img src="/soccer-ball-ani.gif" alt=" " width="16" height="16" />

And again, if you want a 16x16 image, then use one. Don't use a 60x60 image and resize it with HTML.
Christian J
QUOTE(jond @ Jul 14 2007, 08:43 PM) *

I have an icon on the navigation panel on every page of my website (a spinning football).

As a side-note, displaying the animation next to every link will become distracting. Also the ALT text "spinning ball" is not useful to search engines or users with image viewing disabled, for a purely decorational image an empty alt="" is more suitable (or you could make it a background image with CSS).

This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2010 Invision Power Services, Inc.