Typing Text help - calling with href

**PRVLGDRich** · 11-23-2010, 03:58 AM

1) Script Title: Typing Text

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex10/text5.htm

3) Describe problem: I, for whatever reason, cannot get my simple text link to call this script. In my css I hid the div, but I know the problem has little or nothing to do with that I simply cant get the string right for href. The website is currently located http://thedreamcastis.us/one/ --- i essentially need some help with making the link run the script, and I assume the script running will over-ride the hiding of the div?

This is the problem with jQuery lol i go back to regular javascripts and totally suck lol

Thanks in advance for any and all help

Heres some of the code for those who dont want to do the extra work:

CSS:

Code:

a.termopen,a.termopen:link,a.termopen:visited {
	text-decoration: none;
	color: #77dd11;
	background: none;
}

a.termopen:hover {
	text-decoration: none;
	color: #222222;
	background: #77dd11;
}

a.termopen:active {
	text-decoration: none;
	color: #222222;
	background: #dddddd;
}
#one {
	display:none;
}

HTML:

Code:

<TD VALIGN="top" HEIGHT="408">

	DREAM/NET - Terminal<BR><BR>

	<A HREF="javascript:TypingText.runAll" CLASS="termopen">&gt; run system boot&nbsp;</A><BR><BR><BR>



	<div id="one">c:\admin\dreams.sys<BR>

	...<BR>

	program loaded successfully<BR></div>
</TD>
<script type="text/javascript">


new TypingText(document.getElementById("one"), 100, function(i){ var ar = new Array("_", "_"); return " " + ar[i.length % ar.length]; });

//Type out examples:

</script>

and the script is the link given above

thanks again for all help

**PRVLGDRich** · 11-23-2010, 03:59 AM

And also thanks to Twey - this is the ONLY script that can have links and a cursor and everything I needed to make this visually how I wanted - so thanks!

**jscheuer1** · 11-23-2010, 05:12 AM

Code:

<A HREF="javascript:run_system_boot();" onclick="TypingText.runAll();document.getElementById('one').style.display = 'block';return false;" CLASS="termopen">&gt; run system boot&nbsp;</A>

and:

Code:

<script type="text/javascript">
new TypingText(document.getElementById("one"), 100, function(i){ var ar = ["_", " "]; return " " + ar[i.length % ar.length]; });
</script>

**PRVLGDRich** · 11-23-2010, 07:53 AM

thank you SOOOO much - i feel like an idiot for not figuring that out - haha
only one final follow up question

i now have multiple choices for the user to click, and I would like for whatever the user clicks to over-ride whatever was just typed (if they pick say "system boot" and it types it all, then they click "mail system" it appends the new choice instead of over-writing what was previously written)

is this at all possible? Nothing has changed except everything has its own DIV and its own call from the TypingText javascript.

Thanks yet again in advance that response was really helpful and very fast.

**PRVLGDRich** · 11-23-2010, 08:00 AM

Now it seems to be calling BOTH things, like if you watch system boot then hit mail system it will start typing both

Thanks again

**PRVLGDRich** · 11-23-2010, 07:33 PM

i will gladly donate to anyone who can help me out, i know my request may be tedious but i NEED it and cant seem to figure out how to do it nor find anything online that helps with clearing a div and calling a script at the same time

**jscheuer1** · 11-23-2010, 07:45 PM

Tedious is right. Much has changed, fortunately there's no need to edit the TypingText.js file. Use this for the page:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DREAM/NET - Terminal</title>
<link type="text/css" href="style.css" rel="stylesheet" /> 
<script type="text/javascript" src="TypingText.js">
/****************************************************
* Typing Text script- By Twey @ Dynamic Drive Forums
* Visit Dynamic Drive for this script and more: http://www.dynamicdrive.com
* This notice MUST stay intact for legal use
****************************************************/
</script>
</head>

<body>

<TABLE BORDER="0" CELLSPACING="0" CELLPADDING="0">

<TR>

<TD HEIGHT="35"><TABLE BORDER="0" CELLSPACING="0" CELLPADDING="0" WIDTH="105" HEIGHT="35"><TR><TD>&nbsp;</TD></TR></TABLE></TD>

<TD VALIGN="top">&nbsp;</TD>

</TR>

<TR>

<TD><IMG SRC="images/spacer.gif" HEIGHT="408" WIDTH="1"></TD>

<TD VALIGN="top" HEIGHT="408">

	DREAM/NET - Terminal<BR><BR>

	<A HREF="javascript:run_system_boot();" onclick="return TypingText.dreamOne('boot');" CLASS="termopen">&gt; run system boot&nbsp;</A><BR>
    <A HREF="javascript:run_mail_system();" onclick="return TypingText.dreamOne('mail');" CLASS="termopen">&gt; run mail system&nbsp;</A><BR>
    <A HREF="javascript:run_dream_casts();" onclick="return TypingText.dreamOne('cast');" CLASS="termopen">&gt; run dream casts&nbsp;</A><BR><BR><BR>



	<div id="boot">c:\&gt;admin\dreamnet.sys<BR>

	loading..................<BR><br />
    
    If it's come to this, you are the last of the few.  This <br />
    dream/net terminal is the only survivng network of dream <br />
    casts.  Initially a global web of recorded memories, the <br />
    dream/net has become our sole refuge from The Hype. <br /><br />
    Survivors upload dream casts to remind the resistance <br />
    what we are all fighting for.  Without dreams we have <br />
    no past, no present, and no future. <br /><br />
    DOWN WITH THE HYPE!!!<BR />
    LONG LIVE THE DREAMERS!!!</div>
    
    <div id="mail">c:\&gt;admin\dreamail.exe<BR>

	login: techiro_wantanabe<BR>
    pass: ********<br /><br />
    
    -FROM: Rich N Seyi <br />
    -SUBJECT:  DONT BELIEVE THE HYPE!!<br />
    LONG LIVE THE DREAMERS!!!</div>
    
        <div id="cast">c:\&gt;dreamcasts\dir<BR>

	loading..................<BR><br />
    
    &gt;&gt; DREAM CAST 0100: HOLD ME DOWN <br />
    &gt;&gt; DREAM CAST 0201: RELAX <br />
    &gt;&gt; DREAM CAST 0013: MONSTER </div>
<div id="text1">&nbsp;</div>
<div id="text2">&nbsp;</div>
<div id="text3">&nbsp;</div>

	
<TR>

<TD></TD><TD CLASS="disclaimer">

	Note/Disclaimer: No data of any kind is transmitted to any kind of<BR>

	server or service.  The Hype are watching...<BR>

</TD>

</TR>



</TABLE>



<P CLASS="keywords"><FONT COLOR="#222222">KEYWORDS: JS/UIX, JavaScript virtual UN*X, JavaScript virtual OS, JavaScript virtual Operating System, virtual Operating System for web browsers, JavaScript UNIX emulator<BR>http://www.masswerk.at/jsuix/ by Norbert Landsteiner</FONT></P>



<DIV ID="termDiv" STYLE="position:absolute; top:20; left:100;"></DIV>

<DIV ID="termKbdDiv" STYLE="position:absolute; top:290; left:100;visibility:hidden"></DIV>

<script type="text/javascript">
(function(){
	var ids = ['boot', 'mail', 'cast'], // set id's of your typeing text divisions
	cursor = function(i){ var ar = ['_', ' ']; return ' ' + ar[i.length % ar.length];}, // set function for the cursor

	/////////////////// No Nedd to Edit Below Here ///////////////////

	tt = TypingText, el = function(id, s){return s? document.getElementById(id).style : document.getElementById(id);},
	finished = function(){this.inprocess = false;}, i = ids.length - 1,
	wipe = function(){
		var i = ids.length - 1, id;
		for (i; i > -1; --i){
			el((id = ids[i]), 1).display = 'none';
			if(tt[id].inprocess){tt[id].currentChar = tt[id].origText.length;}
		}
	};
	tt.dreamOne = function(which){
		wipe();
		tt[which].run();
		tt[which].inprocess = true;
		el(which, 1).display = 'block';
		return false;
	};
	for (i; i > -1; --i){tt[ids[i]] = new tt(el(ids[i]), 100, cursor, finished);}
})();
</script>


</BODY>

</HTML>

Any questions, feel free to ask. I did try to anticipate how it should work. If I missed anything, let me know. See the comments near the beginning of the script at the end of the page for two configuration options. These I also set as it appears currently required.

Thread: Typing Text help - calling with href

Thread Tools

Search Thread

Typing Text help - calling with href

Bookmarks

Bookmarks

Posting Permissions