PDA

View Full Version : Adding HTML Font details to Javascript

^KoalaBear^
12-16-2002, 06:50 AM
Hi all...

Is there someone who might like to show me the 'textbook' way of adding font type/colour/size etc to a typical doc.write Javascript as posted? And also where to put the <center> and </center> tags?


<SCRIPT LANGUAGE="JavaScript">
<!-- hide script from old browsers
Today = new Date();
time = Today.getHours();
document.write("Good ");
if (time < 6)
document.write("(Early) Morning");
else if (time < 12)
document.write("Morning");
else if (time <= 18)
document.write("Afternoon");
else
document.write("Evening");
document.writeln(" and Welcome to KB's Great Aussie Sites!");
<!-- end hiding script from old browsers-->
</SCRIPT>


.....and something further that I've just noticed, is there any textbook way of nominating a space.. see ("(here)and Welcome to........)

Thanks and Cheers!
KB...
joh6nn
12-16-2002, 08:06 AM
<SCRIPT LANGUAGE="JavaScript">
<!-- hide script from old browsers
Today = new Date();
var daytime, time = Today.getHours();

if (time < 6) { daytime ="(Early) Morning"; }
else if (time < 12) { daytime = "Morning"; }
else if (time <= 18) { daytime = "Afternoon"; }
else {daytime = "Evening"; }

document.write('<span id="greeting">');
document.write("Good" + daytime + " and Welcome to KB's Great Aussie Sites!");
document.write('</span>');
<!-- end hiding script from old browsers-->
</SCRIPT>

you can set font, color, etc, through javascript, though in this case, i think that would be over complicating things. i think that in this particular instance, the simplest thing to do, would be to simply doc.write() in a span, and set the span's style. i did that in bold.
^KoalaBear^
12-16-2002, 09:52 AM
Thanks joh6nn.. but you lost me right from the get-go! :(

For my test, your code produced:
'GoodEvening and Welcome to KB's Great Aussie Sites!' so I'll need to put a character space between the 'Good' and 'Evening' (or whatever)... but I still have no idea how to code it for setting font style etc. :confused:

As I am very much a newbie, is it possible for you to add it to the code you suggested? You might set it as arial/colour #C00000/size 14pt as an example for me so I can follow what you've done.

Thanks in anticipation

KB...
joh6nn
12-16-2002, 10:40 AM
i've color coded things a bit, to make it more obvious, what's doing what.

<style>
#greeting {font: Arial, #C00000, 14pt; }
</style>

<SCRIPT LANGUAGE="JavaScript">
<!-- hide script from old browsers
Today = new Date();
var daytime, time = Today.getHours();

if (time < 6) { daytime ="(Early) Morning"; }
else if (time < 12) { daytime = "Morning"; }
else if (time <= 18) { daytime = "Afternoon"; }
else { daytime = "Evening"; }

document.write('<span id="greeting">');
document.write("Good " + daytime + " and Welcome to KB's Great Aussie Sites!");
document.write('</span>');
<!-- end hiding script from old browsers-->
</SCRIPT>


in order to apply the color and size, etc, i just wrapped the information in a <Span>, and assigned it an id.
^KoalaBear^
12-16-2002, 11:09 AM
Well I'm doin somethin wrong after all your good work!

See HERE (http://home.graffiti.net/aussiesites/greeting-time-of-day-joh6nn.html)

KB...
joh6nn
12-16-2002, 05:55 PM
i made a mistake the first time 'round with the style. it's in bold now, so you can see where it should go, and what it should look like.

<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Mozilla/4.8 [en] (Win98; U) [Netscape]">
<title>greeting-time-of-day-joh6nn</title>

<style>
#greeting { color: #C00000; font: 14pt, Arial; }
</style>

</head>
<body background="bg-text.jpg">

<center>

<script LANGUAGE="JavaScript">
<!-- hide script from old browsers
Today = new Date();
var daytime, time = Today.getHours();

if (time < 6) { daytime ="(Early) Morning"; }
else if (time < 12) { daytime = "Morning"; }
else if (time <= 18) { daytime = "Afternoon"; }
else { daytime = "Evening"; }

document.write('<span id="greeting">');
document.write("Good " + daytime + " and Welcome to KB's Great Aussie Sites!");
document.write('</span>');
<!-- end hiding script from old browsers-->
</script>

</center>

</body>
</html>
^KoalaBear^
12-16-2002, 06:36 PM
Thank you, joh6nn... that worked a charm!

Seeing the actual key to it all helps newbies like me, better understand what each part of the code does.

Much appreciated.... Cheers!

KB...
:thumbsup: