Trouble using CSS inside JavaScript 1

Dragonfish · May 7, 2001

The following scenorio:
On this WebSite a button is pushed to call a JavaScript-function which writes a (style-sheet-formatted) text. This code is in the HTML document (note the rollover-function and the class="style_button_eins" which positions the button work - except with Netscape):

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>hauptfenster</title>
<link rel=stylesheet type="text/css" href="textstyle.css">
<meta name="author" content="gullever">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
<script language="JavaScript" src="steuern.js" type="text/javascript"></script>
</head>

<body text="#FF0000" bgcolor=#C0C0C0 link="#FF0000" alink="#FF0000" vlink="#FF0000">
<FORM>
<input type="image"
src="button1-1.gif"
name="Image1"
class="style_button_eins"
onclick="button('Herren_eins')"
onMouseOver="MM_swapImage('Image1','','button1-2.gif',1)"
onMouseOut="MM_swapImgRestore()">

<input type="image"
src="button1-1.gif"
name="Image11"
class="style_button_elf"
onclick="button('Update')"
onMouseOver="MM_swapImage('Image11','','button1-2.gif',1)"
onMouseOut="MM_swapImgRestore()">
</FORM>
</body>
</html>

When the JavaScript-funtion calls an alert as in case "Herren_eins" it is sucessful. When the JavaScript-funtion calls "Update" then the text - This is a Test - is writen but not formatted with class='style_Mannschaften'.

*** External JavaScript ***
function button(buttonName)
{
switch (buttonName)
{
case "Herren_eins": alert(buttonName);
Break;
case "Update": Update();
Break;
default: alert("does´t work!&quot

;
}
}

function Update()
{
document.write("<p class='style_Mannschaften'>This is a Test</p>&quot

;
}

*** External CSS ***
The CSS line looks like this:
.style_Mannschaften { border: none; position: absolute; top: 100px; left: 570px; width: 250pt; }

If I simply write This is a Test in the HTML document using the style sheet then it works

So my problem is how to integrate CSS into Javascript. Other HTML tags - as we all Know - work in JavaScript. Later when this works I´d like to know how to integrate PHP-statements into JavaScript to access a MySQL Database but I have´nt found any interdeciplinary literature in WWW. Can anybody help.

Thanks - David in Germany

Klae · May 7, 2001

Are you using Netscape? or IE? Klae

You're only as good as your last answer!

Dragonfish · May 7, 2001

I´m testing first with IE because NE never does want you want it to. When the whole thing works I´ll fine tune it for NE.

Thanks David

GIGN · May 7, 2001

try inserting it into an element in the page (innerHTML) - instead of overwriting.Also, careful how deep in you get before trying to crossover to NS - this can caue huge headaches, I actually think developing for NS may be easier to do first, thn ad any extras for IE afterward, but that's just me ;-)
b² - benbiddington@surf4nix.com

Klae · May 7, 2001

with IE you can use innerHTML method. so your p tag is hard coded and you write in it like this.

Code:

HARDCODED---
<P class=&quot;style_Mannschaften&quot; id=&quot;ptag&quot;></P>

Code:

DYNAMIC CODE---
window.ptag.innerHTML = &quot;This is a Test&quot;;

innerHTML is not available for NS. What I use is LAYERS or ILAYERS for the equivalent effect.

Code:

HARDCODED---
<LAYER id=&quot;layertag&quot;></LAYER>

Code:

DYNAMIC CODE---
document.layertag.document.open();
document.layertag.document.write(&quot;This is a test&quot;);
document.layertag.document.close();

Hope this helps. Klae

You're only as good as your last answer!

Dragonfish · May 8, 2001

Thanks to allofya,

I´m busy ploughing thro´ Dan Steinmans WebSite (found the link here). Seems like there´s plenty of Info there

David in Germany

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Trouble using CSS inside JavaScript 1

Dragonfish

Programmer

Klae

Programmer

Dragonfish

Programmer

GIGN

Programmer

Klae

Programmer

Dragonfish

Programmer

Similar threads

Part and Inventory Search

Sponsor