Rollover Links HELP ! ! ! ! ! (Full Version)

All Forums >> [Web Development] >> General Web Development



Message

Guest -> Rollover Links HELP ! ! ! ! ! (8/7/2001 16:49:00)

I gotta problem. I'm trying to make all my links on my page underline whenever someone hovers over it.

Now, I've been told to go to another site that has this feature and scim and scam through the html and paste it onto your own site.

Well, I found this site: http://www.counter-strike.net and you'll notice that the links on the left do have this feature. I went through the HTML to find out what does this and I found this tag that was between the <head> tags:

<LINK
title="global css" href="cssnet.css" type=text/css
rel=stylesheet>

Ok, I know for certain that this is what makes the links underline when hovered over - but when I place it in my <head> tags - it doesn't work!! I'm guessing I have to edit the bits bewteen the speech marks to get it working - but I have NO IDEA what these lines of text mean.

Can anyone help? Either with this problem being solved, or any other way of making my links underlined when hovered over?

Thanks a lot.



Goober -> RE: Rollover Links HELP ! ! ! ! ! (8/7/2001 16:59:00)

That line of code is telling the browser to look at a cascading style sheet (cssnet.css) for instructions on text style.

You could make up a linked style sheet as they did or just add the following to the head section of each page:

<style type="text/css">
A:link {text-decoration: none;}
A:hover {text-decoration: underline;}
A:visited {text-decoration: none;}
</style>

Sandy

------------------
Stu Reilly Design
Allegheny Web
Dreamweaver Sites




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/7/2001 17:19:00)

That didn't work.

Its odd - I tried this with Frontpage - went to Page Properties > Background > Enable Rollover Effects > and then ticked underline.

This actually should work - but it doesn't. However, when I follow the same path and change the colour - it does work.

Hmm..........its weird. Anyways, any idea why it didn't work? I did copy it between the <head> tags...




Goober -> RE: Rollover Links HELP ! ! ! ! ! (8/7/2001 19:22:00)

Go back and make sure you do not have underline ticked.

Sandy

------------------
Stu Reilly Design
Allegheny Web
Dreamweaver Sites




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/7/2001 19:32:00)

Yep, I don't have it ticked and it still don't work

Can you still help me?




abbeyvet -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:25:00)

Take out ANYTHING in the head of your page that refers to the FP rollover effects (it will have FP dynamisization or some such in it).

The code Sandy gave you WILL work - provided you have not overridden it with something else. Highlight the links you want it to work on and click Format>Remove formatting to remove any inline styles you may have used while trying to get this sorted.

When you have removed all this stuff put in what Sandy gave you. It is the answer, it is correct.

If you are still having a problem it would help if you post a url so that we could have a look at your code.

As for this not working for you:
<LINK
title="global css" href="cssnet.css" type=text/css
rel=stylesheet>

For it to work you would need to have an external style sheet called cssnet.css in your web, which you don't, so it is a meaningless instruction in terms of your own site. If you want to you can have a look at this tutorial about CSS which may make it somewhat clearer. http://www.outfront.net/articles/css1.htm

------------------
Katherine

InKK Design
LinKKs - Kilkenny's Online Magazine


-*-*-*-*-*-*-*-*-*-*
"Dogs have owners, cats have staff!"

[This message has been edited by abbeyvet (edited 08-08-2001).]




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:11:00)

OK, I'm actually only looking at the preview page in Frontpage to see if it works - and it doesn't. But say if I publish it, will I have more chance of it working at all? If not, just let us know, and I'll publish it anyways and you can have a look at the code.



Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:38:00)

Btw, this line of html that I was given:

<style type="text/css">
A:link {text-decoration: none;}
A:hover {text-decoration: underline;}
A:visited {text-decoration: none;}
</style>

Did I need a .css file to make it work or something? Because I don't - could THAT be the problem?




abbeyvet -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:42:00)

That is CSS - it IS a style sheet, an embedded one.

And it does work so there is obviously something in your code that is preventing it form working. Publishing it is unlikely to make it work but it would allow us to see your code so yes, it would help greatly.

One thought - try this instead:

<style type="text/css">
A:link {text-decoration: none;}
A:visited {text-decoration: none;}
A:hover {text-decoration: underline;}
</style>

It may be that all you links are already visited so the hover is not showing up. Putting hover last makes visited links as well as unvisited one become underlined on hover.

------------------
Katherine

InKK Design
LinKKs - Kilkenny's Online Magazine


-*-*-*-*-*-*-*-*-*-*
"Dogs have owners, cats have staff!"

[This message has been edited by abbeyvet (edited 08-08-2001).]




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:43:00)

OK, now I am EXTREMELY confused.

I went to http://www.anybrowser.com and went to "View Site" on a Netscape browser.

Anyway, when I did so, the rollover links worked!! However, when I just go to my homepage through my own Internet Explorer - it doesn't work.

Does this mean that this tag:
<style type="text/css">
A:link {text-decoration: none;}
A:hover {text-decoration: underline;}
A:visited {text-decoration: none;}
</style>

...only works on Netscape browsers? Or is there just something very weird going on with my IE?



abbeyvet -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:47:00)

See my post above, your links are visited in your own browser. Also hover effects do not work at all in Netscape prior to version 6.

------------------
Katherine

InKK Design
LinKKs - Kilkenny's Online Magazine


-*-*-*-*-*-*-*-*-*-*
"Dogs have owners, cats have staff!"

[This message has been edited by abbeyvet (edited 08-08-2001).]




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:00:00)

*Sigh* It still didn't work. I'll publish the page in a bit, but in the meantime, here's the code. See if ya can find the problem...

Oh, and btw, if it doesn't work in the Preview on Frontpage - does this definately mean that it won't work at all on the web? Anyways, let us know...


<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">

<style type="text/css">
A:link {text-decoration: none;}
A:visited {text-decoration: none;}
A:hover {text-decoration: underline;}
</style>


</head>

<body background="whitebg.jpg" vlink="#0000FF" alink="#0000FF">

<div align="left">
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="757" height="1" id="AutoNumber2">
<tr>
<td width="757" height="1" style="border-style: none; border-width: medium">
<a href="index.htm">
<img border="0" src="Taxster_Bar1.jpg" width="757" height="98"></a><hr>
</td>
</tr>
</table>
</div>
<div align="left">
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-width: 0" bordercolor="#111111" width="757" height="28" id="AutoNumber1">
<tr>
<td width="274" height="28" style="border-style: none; border-width: medium" valign="top" rowspan="3">
<p>
<b>
<font size="4" color="#FFFFFF">
<marquee bgcolor="#000000">File-Sharing</marquee></font></b><font face="Times New Roman"><a href="../myweb3/The%20Programs.htm" style="text-decoration: none; font-weight: 700">The
Programs</a> <b>(full list)</b></font><b><font size="4" face="Times New Roman"><br></font>
<font face="Times New Roman">
<a href="../myweb3/What%20is%20File%20Sharing.htm" style="text-decoration: none">What is
file-sharing?</a><font size="4"><br></font>
<a href="../myweb3/What%20Happened%20to%20Napster.htm" style="text-decoration: none">What's happened to Napster?</a><br>
<a href="../myweb3/What%20is%20Taxster.htm" style="text-decoration: none">What
is Taxster?</a></font><br><br>
<font size="4" color="#FFFFFF">
<marquee bgcolor="#000000">Popular P2P Programs</marquee></font><a href="../myweb3/Napster.htm" style="text-decoration: none">Napster</a><br>
<a href="../myweb3/Morpheus.htm" style="text-decoration: none">Morpheus</a><br>
<a href="../myweb3/AudioGalaxy.htm" style="text-decoration: none">Audio Galaxy</a><br>
<a href="../myweb3/Bearshare.htm" style="text-decoration: none">Bearshare</a><br>
<a href="../myweb3/iMesh.htm" style="text-decoration: none">iMesh</a><br>
<a href="../myweb3/WinMX.htm" style="text-decoration: none">WinMX</a><br>
<a href="../myweb3/Gnotella.htm" style="text-decoration: none">Gnotella</a><br>
<a href="../myweb3/Direct%20Connect.htm" style="text-decoration: none">Direct Connect</a><br>
<a href="../myweb3/Limewire.htm" style="text-decoration: none">Limewire</a><br>
<a href="../myweb3/Hotline.htm" style="text-decoration: none">Hotline<br></a><u>
<a href="../myweb3/Other%20P2P%20Programs.htm" style="text-decoration: none">Other
P2P Programs<font style="font-size: 12.5pt">......</font></a></u><br><br>
<font size="4" color="#FFFFFF">
<marquee bgcolor="#000000">Features</marquee></font><br>
<a style="text-decoration: none" href="#News">News</a><br>
<a href="http://pub39.ezboard.com/btaxster" style="text-decoration: none">Message
Board</a><br>
<a href="../myweb3/Articles.htm" style="text-decoration: none">Articles</a><br>
<a href="../myweb3/MP3%20Tools.htm" style="text-decoration: none">MP3 Tools</a><br>
<a href="../myweb3/Video%20Tools.htm" style="text-decoration: none">Video Tools</a><br><br>
<font color="#FFFFFF" size="4">
<marquee bgcolor="#000000">Others</marquee></font><br>
<a href="mailto:rishdeep@hotmail.com" style="text-decoration: none">E-mail me</a><br>
<a href="../myweb3/Why%20this%20site%20was%20created.htm" style="text-decoration: none">Why this
site was created</a><br>
<a href="../myweb3/Disclaimer.htm" style="text-decoration: none">Disclaimer</a><br> </b><p>
 </td>
<td width="11" height="28" style="border-style: none; border-width: medium" valign="top" rowspan="3">
<p> </td>
<td width="579" height="89" style="border-left-style: none; border-left-width: medium; border-right-style: none; border-right-width: medium; border-top: medium none #111111; border-bottom: medium none #111111" valign="top"><p>



<img border="0" src="indexbar1.jpg" width="577" height="20"></p>


<p></p>
<p align="justify">Hi, my name is Rish, and welcome to Taxster!. Because this has
just been put on the web, I'll explain a bit about what <b>Taxster</b> is.</p>
<p align="justify">Firstly, <b>Taxster is NOT another file sharing clone
of Napster</b>. It's a
site which I created so people can come to and get the latest file-sharing
pro<img border="0" src="P2P.jpg" align="left" width="132" height="141">gram, which are all reviewed personally by myself, and get the files
YOU want.<span lang="en-us"> <b>If you want to find an alternative to
Napster - You've come to the right place.</b></span> After Napster started blocking the files, some people have no
idea of what to do in order to get all the MP3s they want to download.</p>
<p align="justify">So this site is your one stop<span lang="en-us">, er..........</span>shop, to get any file sharing
programs you want <span lang="en-us">to</span> <b>replace Napster</b><span lang="en-us">.</span> Click on the links on
the left to navigate the site, and find out about the file-sharing
revolution. If you wanna see the list of programs that I have already
reviewed, go to the top link on the left called: The Programs.
<span lang="en-us">Hmm............ or you can</span> just click
<a href="../myweb3/The%20Programs.htm" style="text-decoration: none">
here</a> </p>
<p align="justify">By the way, you'll notice that there are a couple of
things on the site that aren't up yet - most notably MP3 Tools, and Video
Tools. This is basically where<img border="0" src="Your%20Internet.jpg" align="right" width="333" height="88"> <b>
I need YOUR help</b> to complete it - go
to those links to find out how. Oh, and the <b>message board</b> isn't
properly up yet - I'm still debating about whether I should keep it or
not. Anyways, I'll keep a temporary forum in there for the moment to <b>
let you guys decide</b>, or post whatever messages you have.</p>
<p align="justify">Oh, and you can
<a href="mailto:rishdeep@hotmail.com" style="text-decoration: none">e-mail me</a> if you have any comments about the site.
Enjoy the site! - <b>
<a style="text-decoration: none" title="Mail Me" href="mailto:%20rishdeep@hotmail.com">Rish</a></b> </p>
<hr align="justify">



<p align="justify">
<a name="News"></a>
<img border="0" src="indexbar2.jpg" width="577" height="20"></p>
<p align="justify"><b>Napster Temporarily Shutdown Until
Further Notice...</b><img alt="Napster" src="napword.gif" align="right" border="0" width="283" height="79"><b><br></b>As you
know, Napster has been told to filter out all its copyrighted files,
however users was still able to gain files that were deliberately spelt
incorrectly. So, a federal judge has ordered to keep its servers offline
until it can effectively block ALL of its copyrighted files. What this
means for you is that you can no longer download ANY files off Napster's
servers until further notice (not that many people have been doing so
recently anyway). Anyways, click on the link to go to Napster's homepage
for more news.</p>
<p align="right"><font face="Arial" size="4">[</font><font size="2">
<a style="text-decoration: none; font-weight:700" target="_blank" href="http://www.napster.com">LINK</a>
</font><font face="Arial" size="4">]</font></p>
<hr>
<p align="justify">
<img border="0" src="indexbar3.jpg" width="577" height="20"></p>
<p align="justify"><b>New version of Bearshare (2.2.6) released... <br></b>...and hardly anything has changed. Click on the link for
the review.</p>
<p align="right"><font face="Arial" size="4">[</font><font size="2">
<a style="text-decoration: none; font-weight:700" target="_blank" href="../myweb3/Bearshare.htm">LINK</a>
</font><font face="Arial" size="4">]</font></p>
<p align="justify"><b>New version of Limewire released (hurrah!)...<br></b>
Its always great to have new versions of file-sharing programs being
released. But when you can't get them to work.....well, it pisses you off
Anyways, if you wanna hear what problems I had, just click on the link.</p>
<p align="right"><font face="Arial" size="4">[</font><font size="2">
<a style="text-decoration: none; font-weight:700" target="_blank" href="../myweb3/Limewire.htm">
LINK</a>
</font><font face="Arial" size="4">]</font></p>
<hr>
</td>
</tr>
</div>

</div>

</body>

</html>




gorilla -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:23:00)

clear your browser cache - then try.



Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:43:00)

quote:
Originally posted by gorilla:
clear your browser cache - then try.

How?




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:55:00)

quote:
Originally posted by abbeyvet:
That is CSS - it IS a style sheet, an embedded one.

And it does work so there is obviously something in your code that is preventing it form working. Publishing it is unlikely to make it work but it would allow us to see your code so yes, it would help greatly.

One thought - try this instead:

<style type="text/css">
A:link {text-decoration: none;}
A:visited {text-decoration: none;}
A:hover {text-decoration: underline;}
</style>

It may be that all you links are already visited so the hover is not showing up. Putting hover last makes visited links as well as unvisited one become underlined on hover.

[/B]

YOU WERE RIGHT! I put a link on my page that I had never visited on my site and when I hovered over it in Preview on FP, it worked.

However, the already visited sites didn't work. Now what?




abbeyvet -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:01:00)

You pages are filled with inline styles. Inline styles completely override your style sheet.

You have this sort of thing everywhere:

<a href="../myweb3/Morpheus.htm" style="text-decoration: none">Morpheus</a>

See the bit that says style="text-decoration: none"

That is an inline style.

Inline stlyes override embedded styles - the one you were given

You need to remove all these for the code to work.

------------------
Katherine

InKK Design
LinKKs - Kilkenny's Online Magazine


-*-*-*-*-*-*-*-*-*-*
"Dogs have owners, cats have staff!"




Guest -> RE: Rollover Links HELP ! ! ! ! ! (8/8/2001 20:41:00)

YYYYYYYYYYEAAAAAAAAAAHHHHHHHHHHHHHH!!!!!!!!!!

FINALLY! IT WORKS!

I just wanna say thanks for ALL your hwlp




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.109375