-
Welcome to Overclockers Forums! Join us to reply in threads, receive reduced ads, and to customize your site experience!
Html
- Thread starter stan03
- Start date
- Joined
- Jul 30, 2002
- Location
- Midland, Ontario
links fade?
you mean like a visited link be a different colour then an unvisited link?
you would just set
link = somecolour vlink =somecolour in your body settings
you mean like a visited link be a different colour then an unvisited link?
you would just set
link = somecolour vlink =somecolour in your body settings
- Joined
- Jan 7, 2004
- Location
- atlanta
- Joined
- Jan 7, 2004
- Location
- atlanta
yea, that's just CSS..
you can put this in your stylesheet
a {
color: (original color);
text-decoration:none }
a:visited {
color: (original color);
text-decoration:none }
a:active {
color: (original color);
text-decoration:none }
a:hover {
color: (hoverl color);
text-decoration:underline (this would also underline the text when you hover over it, can also be none, overline, line-through) }
if you aren't familar with stylesheets, check out w3schools, or just ask.
you can put this in your stylesheet
a {
color: (original color);
text-decoration:none }
a:visited {
color: (original color);
text-decoration:none }
a:active {
color: (original color);
text-decoration:none }
a:hover {
color: (hoverl color);
text-decoration:underline (this would also underline the text when you hover over it, can also be none, overline, line-through) }
if you aren't familar with stylesheets, check out w3schools, or just ask.
Last edited:
- Joined
- Jan 7, 2004
- Location
- atlanta
i'm not familiar with dreamweaver, i just use notepad. you can try and paste this in your head:
<style type="text/css">
a, a:visited, a:active, {
color:#000000; }
a:hover {
color:#ffcc00; }
</style>
if there is already a <style> section, just add the code to it. it should work for the whole page. this will make all of your links black, until they are "mouse-overed", in which case they will turn yellow. in-line style declarations will override this, as well as more specific declarations in the style sheet, such as:
td a:hover {
color:#ffffff; }
this would make all of the links, when they are "mouse-overed" turn white; but only if they are an elemt of the td, because it is more specific.
-------------------------------------------------------------
edit:
scratch all of that. i was wondering what you were talking about with the fading, cause it didn't look like fading to me. the "fading" doesn't work in mozilla, so scratch all of that above crap. it IS in fact done with javascript. I not real good with .js but you can usually finde pre-writtin scripts on the internet that do what you want them to do... anyway, if you look in the source code for this page you'll see a line that says something like <script ... blah blah.js> </script>
(there's probably a few of them) the particular script is not written in the soucre, it's a link to an outside script file... so on, so fourth...
anyway, you can find a similar code to do what you want here:
Link fader Script
<style type="text/css">
a, a:visited, a:active, {
color:#000000; }
a:hover {
color:#ffcc00; }
</style>
if there is already a <style> section, just add the code to it. it should work for the whole page. this will make all of your links black, until they are "mouse-overed", in which case they will turn yellow. in-line style declarations will override this, as well as more specific declarations in the style sheet, such as:
td a:hover {
color:#ffffff; }
this would make all of the links, when they are "mouse-overed" turn white; but only if they are an elemt of the td, because it is more specific.
-------------------------------------------------------------
edit:
scratch all of that. i was wondering what you were talking about with the fading, cause it didn't look like fading to me. the "fading" doesn't work in mozilla, so scratch all of that above crap. it IS in fact done with javascript. I not real good with .js but you can usually finde pre-writtin scripts on the internet that do what you want them to do... anyway, if you look in the source code for this page you'll see a line that says something like <script ... blah blah.js> </script>
(there's probably a few of them) the particular script is not written in the soucre, it's a link to an outside script file... so on, so fourth...
anyway, you can find a similar code to do what you want here:
Link fader Script
Last edited:
- Joined
- Jan 7, 2004
- Location
- atlanta
i downloaded it and it's working just fine. make sure to remove any
a:hover tags, as the website says.
the start of your document should look something like this:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="StyleSheet" href="style.css" type="text/css" />
<title>blah blah </title>
<script src="fader.js" language="Javascript"></script>
</head>
<body> etc. etc.
i think dreamweaver is probably putting inline "link" and "vlink" attributes.. you might need to remove those. is your page on the web already? maybe if i saw it i could help.
a:hover tags, as the website says.
the start of your document should look something like this:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="StyleSheet" href="style.css" type="text/css" />
<title>blah blah </title>
<script src="fader.js" language="Javascript"></script>
</head>
<body> etc. etc.
i think dreamweaver is probably putting inline "link" and "vlink" attributes.. you might need to remove those. is your page on the web already? maybe if i saw it i could help.
OP
- Joined
- Mar 30, 2003
- Thread Starter
- #10
i think it got it man 
WHOOO, yi can't show my happyness right now ... its not uploaded yet cause its only fragments. ill post it as soon as i got it.
oh and the reason it messed up was i forgot to remove a hover on all the pages
thanks alot for you help so far.
WHOOO, yi can't show my happyness right now ... its not uploaded yet cause its only fragments. ill post it as soon as i got it.oh and the reason it messed up was i forgot to remove a hover on all the pages
thanks alot for you help so far.
- Joined
- Jan 7, 2004
- Location
- atlanta
no problem, i'm new to overclocking, so i can't really help in the other forums to much, so it's nice to give back...
btw.. that version of the fader works for mozilla as well..
btw.. that version of the fader works for mozilla as well..
- Joined
- Jan 7, 2004
- Location
- atlanta
what font are you trying to use? -internet explorer might not be able to display that font correctly... if you are using something out of the ordinary.
otherwise you could use
body {
font-family:Verdana, Arial, Helvetica, Sans-Serif; } <-prioritized fonts
also, dreamweaver might be placing inline tags on the sections of text.. you'll need to remove those for a global css tag to work.
if you're interesting in what css can do, check out:
csszengarden it's a basic page, with no formatting other than div id's, that people format using css.
otherwise you could use
body {
font-family:Verdana, Arial, Helvetica, Sans-Serif; } <-prioritized fonts
also, dreamweaver might be placing inline tags on the sections of text.. you'll need to remove those for a global css tag to work.
if you're interesting in what css can do, check out:
csszengarden it's a basic page, with no formatting other than div id's, that people format using css.
OP
- Joined
- Mar 30, 2003
- Thread Starter
- #15
do you know how i can make a bar like the one at the top of http://www.techdot.com ? the one that says "Home", "reviews", etc? that looks cool
- Joined
- Jan 7, 2004
- Location
- atlanta
try changing the font to something other than arial (not times) and see if it works in the browser. try the font family declaration if that doesn't work, then check to see if there's a more specific tag somewhere.
that bar is actually just several pictures sliced up and put into a table. It's not too hard to do, the had part is the graphic design. I think dreamweaver can do all the slicing and positioning for you, but i've never used it.
that bar is actually just several pictures sliced up and put into a table. It's not too hard to do, the had part is the graphic design. I think dreamweaver can do all the slicing and positioning for you, but i've never used it.
- Joined
- Jan 7, 2004
- Location
- atlanta
if you use mozilla you can see what i mean (it's free www.mozilla.org). i don't think internet explorer allows you to do this. just open the page with mozilla and right click on a part of the bar. go to view image, and it will show you what image is there. the links are small boxes, and the bar itself is a small rectangle that is repeated horizontally... looks like they used a program to do it.
