View Single Post
  #13   Spotlight this post!  
Unread 22-04-2004, 17:33
jonathan lall's Avatar
jonathan lall jonathan lall is offline
Registered User
FRC #2505 (The Electric Sheep; FRC #0188 alumnus)
Team Role: Mentor
 
Join Date: Jan 2002
Rookie Year: 2001
Location: Toronto, Canada
Posts: 547
jonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond reputejonathan lall has a reputation beyond repute
Send a message via MSN to jonathan lall
Re: Woburn Robotics Online: team188.com

Quote:
Originally Posted by LauraN
Very, very nice. I especially liked how you did the color fade on the links in the navigation bar. Is that some trade secret, or can you tell us how you did it without using javascript? *hopes that isn't too stupid of a question*
No it's not stupid at all. I've been asked this before so I'll give you a long answer. I decided early on that I wasn't going to use Javascript, especially not for something presentational. IMO Javascript, Flash, and especially Java, are very seldom needed or wanted. I like to preach that websites are still documents made to be read and need minimal presentational stuff in them; that's what CSS is for.

I was thinking one day that it'd be cool to have some kind of animation in the menu without using some silly non-HTML appelet to get the effect. What I realized is that through CSS, one could put in an animated .gif file as a background-image for some element. It seems to work in all major browsers except for Opera (but team188.com's menu is redundant and still rolls over normally in Opera). I simply made an animated .gif that runs once (i.e. doesn't loop) for the background-image on the :hover of menu items. It is one pixel in size (I go overboard making all images load quickly), and repeats (tiles) throughout the background because I didn't set a background-repeat rule (this is incidentally the same thing I do to get the background of the site to have stripes; it's a two-pixel image that repeats). When the :hover animation is complete, the static dark red/blue (depending on theme) you see on :hover is the background-color which is also set. So to sum up, there is a ~.5 second animated .gif set as the background-image of the :hover of the menu items, and also a background-color to get the full effect.

Quote:
Originally Posted by LauraN
You seem to be looking for feedback other than everyone just saying, "wow, it's really cool," (since you seem to know that already =P) so I tried to think of some suggestions. The only thing I can think of is that with the large amount of information and documents you have, a sitemap may be useful. I don't really think you need one, but it would make the site even more professional than it already looks and would just be plain cool. This isn't even a criticism, just a suggestion that it took me awhile to come up with. =)

Oh my God you have a theme song. That's completely amazing.
I was going to make a site map but I decided against it simply because that would require me writing a script that updated it as I changed the site. I have no intention of even attempting that! And the theme song is by J 188 (not to be confused with J Flex 188) on these forums. Thanks everyone for the comments.
__________________