Javascript & CSS together for Glowing Text Script Help

Tree Killers

03-05-2005, 04:49 AM

Okay I've been searching all over the place on how to do stuff and I've got most of it completed pretty much... What I was originally doing was trying to make everybody on my forums be able to see the glowing text around staff members names... But that didn't work since there are some members who use Netscape browsers which do not support the filter:glow in CSS... So I had to figure out how to make it work so I came up with using Javascript to tell if the user is using Internet Explorer or another browser and I got it working for the most part...

if in my Javascript I add </script> before the <style> tags and then re-open the javascript after </style> tags it adds the glow - but it runs both sets of code instead of only the one I want... It'll be more clear when I show you my code..

<SCRIPT language="JavaScript">

</SCRIPT>

Okay - so the first set is supposed to run only when the user is running Internet Explorer - the second set is supposed to run only when using any other browser other than Internet Explorer..

Any Tips on how I can edit the code to work?

A1ien51

03-05-2005, 06:13 AM

don't use JavaScript to do it....

Use CSS...You can find info here:
http://www.thesitewizard.com/css/excludecss.shtml

Eric

Tree Killers

03-05-2005, 07:28 AM

I read through that page twice and I have no clue what your talking about to use CSS for....

_Aerospace_Eng_

03-05-2005, 07:33 AM

he was referring to the conditional comments for example this is one of them

and its pretty straight forward, if its IE 6 then use that css file. does that make sense? those comments you see on that page aren't just comments they are comments similar to using a javascript to detect which browser is which but its using conditional comments instead to spit out the right style sheet, this way is more "cross browser" friendly because i dont think javascript has to be enabled for them to work, dont quote me on that

Tree Killers

03-05-2005, 07:36 AM

and I put some code in there and it did absolutely nothing... I don't know much about CSS except how to make the text glow pretty much... so I have no clue how to use the code even now that I see it...

Like how would I put it to be..

if user is using IE do this code

otherwise do this code

??

_Aerospace_Eng_

03-05-2005, 08:34 AM

here try this page in IE and Netscape
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Exclude CSS</title>
<style type="text/css">
body {background:#0000FF;}
</style>

</head>

<body>
</body>
</html>
in IE 6 it displays the background but any other browser it displays the blue one

Tree Killers

03-05-2005, 04:10 PM

Okay so I took your example and added my code into it like this..

<style type="text/css">
#admin{ color=#0000FF; font-weight=bold; width=100%
}
#mod{ color=#05848C; font-weight=bold; width=100%
}
#dstaff{ color=#9704A0; font-weight=bold; width=100%
}
#tstaff{ color=#FF9900; font-weight=bold; width=100%
}
</style>
<style type="text/css">

</style>

Now yes when in IE the glow is there with a white center how i want it - but in Mozilla Fire-Fox the colors haven't changed at all...

_Aerospace_Eng_

03-05-2005, 11:35 PM

try moving the comments outside of the style tags

Tree Killers

03-06-2005, 03:31 AM

I did that and it still didnt change the color when viewed in Firefox....

_Aerospace_Eng_

03-06-2005, 04:05 AM

sighs, this is what i get for not going to bed early last night, in css tyou dont use = you use a : fix those and it should work (didn't even catch that mistake the first time) so it should look like this
<style type="text/css">
#admin{ color:#0000FF; font-weight:bold; width:100%
}
#mod{ color:#05848C; font-weight:bold; width:100%
}
#dstaff{ color:#9704A0; font-weight:bold; width:100%
}
#tstaff{ color:#FF9900; font-weight:bold; width:100%
}
</style>

check out www.w3schools.com for more info on css

Tree Killers

03-06-2005, 04:33 AM

HA! Thank you so much! That worked.... You helped me tons!

Now it works in both browsers and in Netscape it looks the way it should and in IE it has a little bit of a formatting error..

http://img201.exs.cx/img201/7651/wtf3ej.jpg

It should be like this:
http://img201.exs.cx/img201/363/wtf9zx.jpg

Note: the first one is IE and the second on is Firefox - I want em to be next to each other, but in IE they are ontop one another...

_Aerospace_Eng_

03-06-2005, 04:57 AM

we need to see the html coding you are using along with the css in order to give you a decent answer, or even better give us a link?

Tree Killers

03-06-2005, 05:00 AM

I'll give you a link but you might laugh when you see it... I'm not done with hardly any of the graphics and some of them are going to be changed... BTW did I mention this is for my forums?

http://s9.invisionfree.com/GFX_Zone

if you need a Username and PW I have one set up for testing that you could use...

_Aerospace_Eng_

03-06-2005, 05:21 AM

okay take out the widths in the css you have conditional statements for, span elements only extend the width of what is in them since you have 100% they are moving to the next line so try this

see if that fixes it

Tree Killers

03-06-2005, 05:25 AM

Nope still did it... and now I'm logged in with 2 accounts so you can see how it affects the users online table too...

EDIT: When I removed the width:100% from the netscape code too it made it so that it wouldn't even do any of the code... At least in IE - in Firefox it still gives me the colors...

If ya want - (might be a bit quicker anyhow) you can im me on aim @ jblck23