/    Sign up×
Community /Pin to ProfileBookmark

Animate Nav buttons

Copy linkTweet thisAlerts:
Oct 15.2005

hi, im designing a new site and i need to animate the navugaton buttons. I was thinking of using css, but i feel that it may only be possible in javascript (i wanted to use css as this will make the feature veiwable with browsers that have java script disabled). Anyway any help would be great!

Heres what i need to happen:
When the mouse hovers over a gif i want it to move gradually left by X pixles and stay there untill the mouse pointer is removed off it where it gradually moves back to where it was.

Is this possible using css or do i need to use javascript?

Thanks

to post a comment
CSS

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@JPnycOct 15.2005 — You need javascript. I'm pretty sure you can change the position of a linked element on hover, but it won't be gradual. To make it gradual you need loop with a delay.
Copy linkTweet thisAlerts:
@mw2005Oct 15.2005 — If i was doing this i would create an animated gif and make it gradually reveal. Then i would apply a simple mouseover so when the mouse is over the navigational buttons it would change to the animated gif. And when the mouse is off it would change back to the original gif.
Copy linkTweet thisAlerts:
@JPnycOct 15.2005 — How is that going to give the illusion of movement?
Copy linkTweet thisAlerts:
@mw2005Oct 16.2005 — Sorry i misread the question
Copy linkTweet thisAlerts:
@ray326Oct 17.2005 — You could do that with a couple of animated gifs as background images.
×

Success!

Help @james_d_kelly spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.6,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...