Js Typetext Onload Script Not Working With Firefox...


Recommended Posts

I'm trying to get this webpage to work with firefox, but it doesn't seem to want to work no matter what I do. I'm starting to think that it isn't supported, but I know for a fact that it is. I will post the page up on my server later, but for now, here is the code:

<HTML><HEAD>

<TITLE>C:\>SlashDOS</TITLE>

<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">

<META content="slashdos" name=Classification>

<META content="SlashDOS" name=Description>

<META content="Slashdos" name=KeyWords>

<META content="MSHTML 6.00.2600.0" name=GENERATOR>

<script language=Javascript><!--

var tl=new Array(

"::SlashDOS::"

);

var speed=140;

var index=0; text_pos=0;

var str_length=tl[0].length;

var contents, row;

function type_text()

{

contents='';

row=Math.max(0,index-7);

while(row<index)

contents += tl[row++] + '\r\n';

document.forms[0].elements[0].value = contents +

tl[index].substring(0,text_pos) + "_";

if(text_pos++==str_length)

{

text_pos=0;

index++;

if(index!=tl.length)

{

str_length=tl[index].length;

setTimeout("type_text()",1000);

}

} else

setTimeout("type_text()",speed);

}

//--></SCRIPT>

</HEAD>

<br><br>

<BODY vLink=#551a8b aLink=#ff0000 link=#0000ee bgColor=#000000 onload=type_text()>

<FORM>

<TEXTAREA cols="70" rows="1" wrap="soft" style="text-align:center" style="color:white" style="font-size:30" style="font-weight:bold" style="border:none" readonly style="background:#000000"></TEXTAREA>

</FORM>

</BODY></HTML>

As a side quest to this matter I would also like to reference the styles within a CSS file, but I couldn't get it to work for some reason. You would put a link to the class within the TEXTAREA tag itself correct? I am not sure what I was doing wrong, but here is the CSS too:

.texta {

background:#000000

border:none

overflow:hidden

color:white

text-align:center

font-size:30

font-weight:bold

}

Also, putting the JS in an external file would also be sweet, I'm not exactly sure how that is done, but I'm sure it must be fairly simple.

Thanks

\\DOS

Link to post
Share on other sites

OK, I've fixed your textarea and placed your CSS and JavaScript within the html file:

<HTML><HEAD>

<TITLE>C:\>SlashDOS</TITLE>

<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">

<META content="slashdos" name=Classification>

<META content="SlashDOS" name=Description>

<META content="Slashdos" name=KeyWords>

<META content="MSHTML 6.00.2600.0" name=GENERATOR>

<script language=Javascript><!--

var tl=new Array(

"::SlashDOS::"

);

var speed=140;

var index=0; text_pos=0;

var str_length=tl[0].length;

var contents, row;

function type_text()

{

contents='';

row=Math.max(0,index-7);

while(row<index)

contents += tl[row++] + '\r\n';

document.forms[0].elements[0].value = contents +

tl[index].substring(0,text_pos) + "_";

if(text_pos++==str_length)

{

text_pos=0;

index++;

if(index!=tl.length)

{

str_length=tl[index].length;

setTimeout("type_text()",1000);

}

} else

setTimeout("type_text()",speed);

}

//--></SCRIPT>

<style type="text/css">

.texta {

background:#000000;

border:none;

overflow:hidden;

color:white;

text-align:center;

font-size:30;

font-weight:bold;

}

</style>

</HEAD>

<br><br>

<BODY vLink=#551a8b aLink=#ff0000 link=#0000ee bgColor=#000000 onload=type_text()>

<FORM>

<TEXTAREA cols="70" rows="1" wrap="soft" class="texta" readonly></TEXTAREA>

</FORM>

</BODY></HTML>

Here's how it would look if you placed the JavaScript and CSS in separate files:

<HTML><HEAD>

<TITLE>C:\>SlashDOS</TITLE>

<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">

<META content="slashdos" name=Classification>

<META content="SlashDOS" name=Description>

<META content="Slashdos" name=KeyWords>

<META content="MSHTML 6.00.2600.0" name=GENERATOR>

<link href="style.css" type="text/css" rel="stylesheet">

<script language="JavaScript" src="text.js"></script>

</HEAD>

<br><br>

<BODY vLink=#551a8b aLink=#ff0000 link=#0000ee bgColor=#000000 onload=type_text()>

<FORM>

<TEXTAREA cols="70" rows="1" wrap="soft" class="texta" readonly></TEXTAREA>

</FORM>

</BODY></HTML>

style.css

.texta {

background:#000000;

border:none;

overflow:hidden;

color:white;

text-align:center;

font-size:30;

font-weight:bold;

}

text.js

var tl=new Array(

"::SlashDOS::"

);

var speed=140;

var index=0; text_pos=0;

var str_length=tl[0].length;

var contents, row;

function type_text()

{

contents='';

row=Math.max(0,index-7);

while(row<index)

contents += tl[row++] + '\r\n';

document.forms[0].elements[0].value = contents +

tl[index].substring(0,text_pos) + "_";

if(text_pos++==str_length)

{

text_pos=0;

index++;

if(index!=tl.length)

{

str_length=tl[index].length;

setTimeout("type_text()",1000);

}

} else

setTimeout("type_text()",speed);

}

Edited by jsbowen
Link to post
Share on other sites

Works perfect! Thanks man. :)

One last thing though...what sort of browser compatibility am I looking at here? This is going to be on my index page and I didn't want users to not be able to see it properly...

Thanks again

\\DOS

Edited by DOSError
Link to post
Share on other sites

np.

Browser compatibility shouldn't be an issue. You've covered the main two (IE is usually the one you have to adjust for with CSS). All others that are capable of handling CSS and JavaScript should display just fine.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...