change text color with a button

liglin

The following script changes the color of text with the onmousover
event. How can it be modified so it changes the text when the button
is clicked? I'd want to avoid layers or CSS.

Thanks, Liglin
<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
<META http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#FFFFFF" text="#000000">
This is an<b onmouseout="this.style.color = 'black';"
onmouseover="this.style.color = 'red';" align="justify">
example </b>of changing the color of text using a MouseOver.
<INPUT type="submit" name="Submit" value="Change color">
</BODY>
</HTML>

Jul 20 '05 #1

Subscribe Post Reply

18532

Evertjan.

liglin wrote on 06 feb 2004 in comp.lang.javascript:

The following script changes the color of text with the onmousover
event. How can it be modified so it changes the text when the button
is clicked? I'd want to avoid layers or CSS. This is an<b onmouseout="this.style.color = 'black';"
onmouseover="this.style.color = 'red';" align="justify">
example </b>of changing the color of text using a MouseOver.
<INPUT type="submit" name="Submit" value="Change color">
<b id="mybold"
style="color:black;">
example</b>

<button
onclick='document.getElementById("mybold").style.c olor=
"red"'Change color</button>

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Jul 20 '05 #2

Brian Genisio

liglin wrote:

The following script changes the color of text with the onmousover
event. How can it be modified so it changes the text when the button
is clicked? I'd want to avoid layers or CSS.

Thanks, Liglin
<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
<META http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#FFFFFF" text="#000000">
This is an<b onmouseout="this.style.color = 'black';"
onmouseover="this.style.color = 'red';" align="justify">
example </b>of changing the color of text using a MouseOver.
<INPUT type="submit" name="Submit" value="Change color">
</BODY>
</HTML>

Here ya go...

<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
</HEAD>

<SCRIPT>
var toggle = true;
function changeColor()
{
document.getElementById('bID').style.color =
toggle ? "red" : "black";

toggle = !toggle;
}
</SCRIPT>

<BODY bgcolor="#FFFFFF" text="#000000">

This is an <b id=bID>example</b>of changing color with a button
<BUTTON onClick="changeColor()">Change Color</BUTTON>

</BODY>
</HTML>

Jul 20 '05 #3

liglin

Hello Evertjan,
I didn't know about the ID attribute!

Thanks a lot for your help

Liglin
thank you very much for your help.
"Evertjan." <ex**************@interxnl.net> wrote in message news:<Xn********************@194.109.133.29>...

liglin wrote on 06 feb 2004 in comp.lang.javascript:
The following script changes the color of text with the onmousover
event. How can it be modified so it changes the text when the button
is clicked? I'd want to avoid layers or CSS.

This is an<b onmouseout="this.style.color = 'black';"
onmouseover="this.style.color = 'red';" align="justify">
example </b>of changing the color of text using a MouseOver.
<INPUT type="submit" name="Submit" value="Change color">

<b id="mybold"
style="color:black;">
example</b>

<button
onclick='document.getElementById("mybold").style.c olor=
"red"'
Change color</button>

Jul 20 '05 #4

liglin

Hello Brian,

thanks a lot for your great help.
I think it's just wonderful that people over the internet help others.

regards,
Liglin

Brian Genisio <Br**********@yahoo.com> wrote in message news:<40******@10.10.0.241>...

liglin wrote:
The following script changes the color of text with the onmousover
event. How can it be modified so it changes the text when the button
is clicked? I'd want to avoid layers or CSS.

Thanks, Liglin
<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
<META http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
</HEAD>

<BODY bgcolor="#FFFFFF" text="#000000">
This is an<b onmouseout="this.style.color = 'black';"
onmouseover="this.style.color = 'red';" align="justify">
example </b>of changing the color of text using a MouseOver.
<INPUT type="submit" name="Submit" value="Change color">
</BODY>
</HTML>

Here ya go...

<HTML>
<HEAD>
<TITLE>Untitled Document</TITLE>
</HEAD>

<SCRIPT>
var toggle = true;
function changeColor()
{
document.getElementById('bID').style.color =
toggle ? "red" : "black";

toggle = !toggle;
}
</SCRIPT>

<BODY bgcolor="#FFFFFF" text="#000000">

This is an <b id=bID>example</b>of changing color with a button
<BUTTON onClick="changeColor()">Change Color</BUTTON>

</BODY>
</HTML>

Jul 20 '05 #5

Robert

Thanks for the post. This is just the code I have been looking for!

Robert

Jul 20 '05 #6

Brian Genisio

liglin wrote:

Hello Evertjan,
I didn't know about the ID attribute!

Thanks a lot for your help

Liglin

It is very hard to do anything in Javascript with the browser, without
using the ID attribute. All tags have it, and it is how you get access
to the objects.

See document.getElementById(). There are other uses, like in IE,
document.all.id or document.all['id']. Of course, the getElementById is
safer. Look into capability checking...

if(document.getElementById)
... use getElementById
else if (document.all)
... use document.all

Brian

Jul 20 '05 #7

by: Matt Adams | last post by:

As well known I could specify the text color in the body tag like: <BODY TEXT=WHITE LINK=WHITE VLINK=RED ALINK=WHITE> What I want to achieve now is that always (!) the text of the last visited...

Javascript

change text color of a link with onclick event

by: Matt | last post by:

I created 3 hyperlinks, when the user click each link, it will change the color of the text of a link. For example, when user clicks Link1, text Link1 will become red color, but Link2 and Link3...

Javascript

Change text color on a submit button when clicked?

by: AFN | last post by:

I'm trying to set a submit button to change text and color when clicked. Like saying "please wait" instead of "submit" and then changing the background color and text color. All works, except for...

Javascript

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

by: kroger | last post by:

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...

Javascript

CSS: Change text color upon click

by: Yeah | last post by:

I have a multiple choice quiz where I would like to use CSS to change the color of the answers upon clicking them. I would like to present the right and wrong answers up front, rather than direct...

HTML / CSS

Change text color on click

by: Yeah | last post by:

I have a multiple choice quiz where I would like to use CSS to change the color of the answers upon clicking them. I would like to present the right and wrong answers up front, rather than direct...

HTML / CSS

what is fastest way to change text color?

by: Ryan Liu | last post by:

Hi, I want to change keywords text color in a text editor. I select RichTextBox and use its Select() method to select keywords line by line, one by one, then change its color. ...

C# / C Sharp

vb6 Data Report - Change text color at Runtime

by: irfi | last post by:

Hi, Please anyone out there can help me!!!!!!!!!!!! I am building a Data Report in vb6. To make it simple there a three text box on the Report. First for (Date), Second for (In-Time) and the third...

Visual Basic 4 / 5 / 6

change text color onclick, and change it back - will post to DB

by: apparker | last post by:

I'm creating a new GUI for a program and it is for a medical exam. There are so many different things to ask someone during a history it wastes too much space to make checkboxes for everything so I...

Javascript

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Migrating Website to Cloud - Emmanuel Katto

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

General

Navigating the Data Structures and Algorithms (DSA)

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...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Changing the language in Windows 10

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...

Windows Server

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

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...

Online Marketing

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

change text color with a button

Similar topics