473,387 Members | 1,844 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,387 software developers and data experts.

Change text color for one document.write but not color of all text?

Hi, one part of my website is at:

http://www.psych.nmsu.edu/~jkroger/lab/undergrads.html

I want to make the date at the top right darker blue.
But when I do that, all the light blue text next to
the pictures also changes.

How can I control the color of the result of
document.write output without changing the
forground color of the entire page? Note my
document write includes variables, so I was
hesitant to imbed an html command in the
document.write.

Thanks much in advance for any pointers....
Jim

Jul 23 '05 #1
7 5896
<kr****@princeton.edu> wrote in message
news:11**********************@z14g2000cwz.googlegr oups.com...
Hi, one part of my website is at:

http://www.psych.nmsu.edu/~jkroger/lab/undergrads.html

I want to make the date at the top right darker blue.
But when I do that, all the light blue text next to
the pictures also changes.

How can I control the color of the result of
document.write output without changing the
forground color of the entire page? Note my
document write includes variables, so I was
hesitant to imbed an html command in the
document.write.

Thanks much in advance for any pointers....
Jim


var i=12345;

document.write("I'm GREEN text and here's a variable in red:
".fontcolor('green') +i.toString().fontcolor("red"));

--
S.C.

Jul 23 '05 #2
kr****@princeton.edu wrote:
Hi, one part of my website is at:

http://www.psych.nmsu.edu/~jkroger/lab/undergrads.html

I want to make the date at the top right darker blue.
But when I do that, all the light blue text next to
the pictures also changes.

How can I control the color of the result of
document.write output without changing the
forground color of the entire page? Note my
Wrap it in a <span> with the appropriate colour. Your
"get date" function is a bit rough too, suggested
improvement below.

Using arrays for months and days is considerably more
efficient than your multiple if's.
document write includes variables, so I was
hesitant to imbed an html command in the
document.write.


HTML is not "commands", it is markup that is interpreted.
It may seem a trivial point, but there you go. You have
no other way of controlling the colour of the element
than using markup, so use it. I have used a span and style,
but you could use a class too.

<html>
<head>
<title>play</title>
<script type="text/javascript">

function clientDate(){
var months = ['January','February','March',
'April','May','June','July',
'August','September','October',
'November','','December'];

var days = ['Sunday','Monday','Tuesday',
'Wednesday','Thursday','Friday',
'Saturday'];

var now = new Date();

return days[now.getDay()]
+ ', ' + months[now.getMonth()]
+ ' ' + now.getDate()
+ ', ' + now.getFullYear();
}
</script>
</head>
<body>
<script type="text/javascript">
document.write('<span style="color: #333366">' +
clientDate() + '</span>');
</script>
</body>
</html>

--
Rob

Jul 23 '05 #3
RobG wrote:
kr****@princeton.edu wrote:
Hi, one part of my website is at:

http://www.psych.nmsu.edu/~jkroger/lab/undergrads.html

I want to make the date at the top right darker blue.
But when I do that, all the light blue text next to
the pictures also changes.

How can I control the color of the result of
document.write output without changing the
forground color of the entire page? Note my

Wrap it in a <span> with the appropriate colour. Your
"get date" function is a bit rough too, suggested
improvement below.

Using arrays for months and days is considerably more
efficient than your multiple if's.

document write includes variables, so I was
hesitant to imbed an html command in the
document.write.

HTML is not "commands", it is markup that is interpreted.
It may seem a trivial point, but there you go. You have
no other way of controlling the colour of the element
than using markup, so use it. I have used a span and style,
but you could use a class too.

<html>
<head>
<title>play</title>
<script type="text/javascript">

function clientDate(){
var months = ['January','February','March',
'April','May','June','July',
'August','September','October',
'November','','December'];


Empty string between Nov and Dec?
Mick


var days = ['Sunday','Monday','Tuesday',
'Wednesday','Thursday','Friday',
'Saturday'];

var now = new Date();

return days[now.getDay()]
+ ', ' + months[now.getMonth()]
+ ' ' + now.getDate()
+ ', ' + now.getFullYear();
}
</script>
</head>
<body>
<script type="text/javascript">
document.write('<span style="color: #333366">' +
clientDate() + '</span>');
</script>
</body>
</html>

Jul 23 '05 #4
Quite right, but frankly I'd rather December was banished from the
calendar, then I'd not get any older...

--
Rob

Jul 23 '05 #5
Wow, thanks Rob for the help with text color on my dates! I learned a
lot!

Thanks to you as well, S.C. ....

Great place, usenet....

Jim

Jul 23 '05 #6
Say, Rob, why do you put the function declaration in the head, and the
call in the body?

Thanks
Jim

---------------

<html>
<head>
<title>play</title>
<script type="text/javascript">

function clientDate(){
var months = ['January','February','March',
'April','May','June','July',
'August','September','October',
'November','','December'];

var days = ['Sunday','Monday','Tuesday',
'Wednesday','Thursday','Friday',
'Saturday'];

var now = new Date();

return days[now.getDay()]
+ ', ' + months[now.getMonth()]
+ ' ' + now.getDate()
+ ', ' + now.getFullYear();
}

</script>
</head>
<body>
<script type="text/javascript">
document.write('<span style="color: #333366">' +
clientDate() + '</span>');
</script>
</body>
</html>

Jul 23 '05 #7
kr****@princeton.edu wrote:
Say, Rob, why do you put the function declaration in the head, and the
call in the body?


Because that's where you want the date to display.
Mick
Jul 23 '05 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

15
by: Henning Vestergaard Poulsen | last post by:
Hi, I have a problem that I hope someone can help me with. I'm building a web page with pictures I've taken with my digital camera. I have succeded making a javacript that, when clicking on a...
1
by: OM | last post by:
I've found out that I can use <div id = "variable"><div> to change text and pictures on mouseovers. All I have to do is change "variable" to be the HTML text I want. I can even change the text...
14
by: Reply Via Newsgroup | last post by:
Folks, Say I have a table, ten columns, ten rows - Each with a word in it. I want to change the values of some/all of the cells in the table via a hyperlink. How do I reference each cell and...
2
by: RWD | last post by:
I am trying to figure out how to change the target frame in my hyperlink on a DHTML menu. The menu is in one frame and the target frame is called "main" The code is below: Thanks in advance...
4
by: Richard Cornford | last post by:
For the last couple of months I have been trying to get the next round of updates to the FAQ underway and been being thwarted by a heavy workload (the project I am working on has to be finished an...
3
by: Byron | last post by:
Hi, Javascript confuses me, so I usually limit myself to Dreamweaver's built-in scripts for stuff like imageswaps. But this time I'm trying to write something very simple myself. I do most of my...
2
by: Nick Calladine | last post by:
Is this possible to ... I wish to get the value of a dropdown select but gets is indexable value (dont know if that is the right term) if that is possible (the position it assigned get assigned...
8
by: Mateusz Viste | last post by:
Hi, I'm not sure if my question is really related to JavaScript, so please excuse me if that's not the case (and maybe you guys would have an idea what's the cause is and where could I ask)... ...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.