.CSS on this website...

  • Newnewbie
  • Novice
  • Novice
  • Newnewbie
  • Posts: 19

Post 3+ Months Ago

Hey... I like the cool hover effect on this website where it looks like the color actually changes when you rollover a link.

How do they do that?? :P
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Newnewbie
  • Novice
  • Novice
  • Newnewbie
  • Posts: 19

Post 3+ Months Ago

It looks the when you rollover a link, you get an underline (I know how to do that...) and it looks like the color changes from greyish to pinkish to red... Am I just imagining that?? :shock:
  • musik
  • Legend
  • Super Moderator
  • User avatar
  • Posts: 6893
  • Loc: up a tree

Post 3+ Months Ago

When I see something on a website I like I always check the source code to see how it was done, for example I have never seen this script before so to find out how it was done on this page I went to "View" and then "Source" and saw that the link for the script was here: http://www.ozzu.com/fader.js

You would just save that file and then copy this into the head section of your site as was done on here:
<script type="text/javascript" src="fader.js">


Hope that helps,
Rose
  • b_heyer
  • Web Master
  • Web Master
  • User avatar
  • Posts: 4581
  • Loc: Maryland

Post 3+ Months Ago

Yes you are slowly going insane!!!


MWAHAHAHHAAH!!!

Actually I think it is just a bit of javascript....h/o and lemme snatch it for you!......
....
....

...
...



Ok well I can't find it anywhere, can't even find the onMouseOver for it, hrm...

Check around on http://www.hotscripts.com for something like that, it should be there somewhere!

//edit looks like rose beat me!
  • tyghtwad
  • Novice
  • Novice
  • User avatar
  • Posts: 21

Post 3+ Months Ago

Sorry to but in, Rose was right....here's another link with instruction on how to do it including the actual download and command used.


http://admins101.com/scripts/faderlinks.html

Hope that helps :wink:
  • musik
  • Legend
  • Super Moderator
  • User avatar
  • Posts: 6893
  • Loc: up a tree

Post 3+ Months Ago

Butt away! :lol: Oh how I love to be right! :wink: :wink:
  • PluTunium
  • Professor
  • Professor
  • User avatar
  • Posts: 812
  • Loc: Touring the USA

Post 3+ Months Ago

Musik, Who doesn't like to be right?
  • musik
  • Legend
  • Super Moderator
  • User avatar
  • Posts: 6893
  • Loc: up a tree

Post 3+ Months Ago

people who are left? :lol:
  • Truce
  • Guru
  • Guru
  • Truce
  • Posts: 1477
  • Loc: Washington DC

Post 3+ Months Ago

It seems like part of the time it goes from grey to pink to red. But then the other part of the time it jumps to white and then fades to pink and red.
  • rtm223
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1855
  • Loc: Uk

Post 3+ Months Ago

The reason it sometimes goes white first is the css hover property, making it turn white for those people with jscript turned off. If there is a slight delay in the javascript kicking in you see the white css colour first

Thatsmy guess anyway.....
  • SharkShark
  • Guru
  • Guru
  • User avatar
  • Posts: 1013
  • Loc: Living In Today

Post 3+ Months Ago

Yeah Rose is right, also her suggestion to just read the source file, thats How i learned most of my coding, by reading the code of sites i liked. Great way to learn!! :D Also if you want more information on coding CSS try: http://www.w3schools.com/css/default.asp that site will get u started 8)
  • MikeReyes
  • Born
  • Born
  • MikeReyes
  • Posts: 2

Post 3+ Months Ago

How do I change the color of the links? Because I tried using CSS. But the fading effect just stopped.
  • lioness
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1615

Post 3+ Months Ago

Hi. I am using the fader.js on my site and it is working sucessfully in places. When I only use <a href="#">clickypoos</a> tags it works beautifully, but when it is nested within a list <li> or table <td> element the fade does not work correctly...

When in an <li> or <td> or other element it changes to red (no fade) on the second time I hover over it! - and it stays red!

Does anyone have any ideas why this could be happening? I do not have any other :link,:hover, etc styles set up nor do I have any other javascripts running


//edit (see below)

I figured it out. The reason it was not working inside the other elements, was because the font for those elements had a color specified using a name e.g. l'red'. The font colors (a:hover, etc) need to be specified in hexadecimal values? e.g. #ff0000
  • sycofi5h
  • Expert
  • Expert
  • sycofi5h
  • Posts: 506
  • Loc: Australia

Post 3+ Months Ago

well thisis wat i used
Code: [ Select ]
<style type="text/css">
a:hover {color: #watever color;}
a:link {color: #watever color;}
  1. <style type="text/css">
  2. a:hover {color: #watever color;}
  3. a:link {color: #watever color;}

a:hover is wen ur put ur mouse over the link and it turns that color.
a:link is the actual color of the link on the screen with ur mouse not over it.
I think that is wat you wanted. but i dont no how to do the fading effect.
  • lioness
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 1615

Post 3+ Months Ago

sycofi5h wrote:
well thisis wat i used
Code: [ Select ]
<style type="text/css">
a:hover {color: #watever color;}
a:link {color: #watever color;}
  1. <style type="text/css">
  2. a:hover {color: #watever color;}
  3. a:link {color: #watever color;}

a:hover is wen ur put ur mouse over the link and it turns that color.
a:link is the actual color of the link on the screen with ur mouse not over it.
I think that is wat you wanted. but i dont no how to do the fading effect.


No I'm all set - I have the fading effect working ok.
  • bluephoenix
  • Proficient
  • Proficient
  • User avatar
  • Posts: 331

Post 3+ Months Ago

I've always known it was JavaScript, but I've always loved the effect spin (the tech head) used on the Phrozen Keep's forums. (link: http://phrozenkeep.it-point.com/forum/index.php )
  • suzie
  • Guru
  • Guru
  • User avatar
  • Posts: 1134
  • Loc: England

Post 3+ Months Ago

Quote:
Butt away! Oh how I love to be right!



Ahahaaaaaaaaaaaaaaaaa

Girl power...lmaooooo

:D :D

Post Information

  • Total Posts in this topic: 17 posts
  • Users browsing this forum: No registered users and 69 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.