/    Sign up×
Community /Pin to ProfileBookmark

anyone plz show me the scipt that performs a string like we type on typewritter,letters appears one after one???
thanks.

to post a comment
JavaScript

11 Comments(s)

Copy linkTweet thisAlerts:
@herodote92Feb 26.2005 — I quickly developed the following one, it works:
<i>
</i>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;
&lt;script language=javascript&gt;
var x = "";
var s = "Hello, I am the typewriter.";
var s1 = "";

function AddChar() {
if (s1.length &gt;= s.length) {
clearInterval(x);
}
else {
s1 = s1 + s.substr(s1.length,1);
document.getElementById("my_span").firstChild.data = s1;
}
}
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;style&gt;
.my_class {font-family:monospace; font-size:15pt; font-weight:bold; color:Black;}
&lt;/style&gt;
&lt;input type="button" value="Test" onclick="setInterval('AddChar()',300);"&gt;
&lt;br&gt;&lt;br&gt;
&lt;span id="my_span" class="my_class"&gt;&amp;nbsp;&lt;/span&gt;
&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@herodote92Feb 26.2005 — Hmm, normally there was a blank character (& n b s p ? between <span> and </span>, but it was skipped in my message.
Copy linkTweet thisAlerts:
@herodote92Feb 26.2005 — Oh, dammit, when will all I write stop being misinterpreted. I didn't wink, I tried to write something like: ampersand, letter n, letter b, letter s, letter p, semicolon. Hope it comes through this time.

And now I'll try for real to add a smiley:

:rolleyes:
Copy linkTweet thisAlerts:
@PittimannFeb 26.2005 — Hi herodote92!

If you want the non-breaking space to show up properly, just type:

&amp;amp;nbsp;

Cheers - Pit
Copy linkTweet thisAlerts:
@musicfanauthorFeb 26.2005 — hic...nothing but a button appears&don't work....
Copy linkTweet thisAlerts:
@PittimannFeb 26.2005 — Hi!

You can take [URL=http://www.pit-r.de/scripts/typewriter.htm]this one[/URL] if you like.

Cheers - Pit
Copy linkTweet thisAlerts:
@herodote92Feb 26.2005 — Thanx, Pittimann.

I improved the whole thing a little bit, and tested it in IE6, Netscape 7.2 and Mozilla 1.6. It works all right. Now the button will work every time you click on it, not only once. The text will be printed instead of the original question mark.
<i>
</i>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;

&lt;script language=javascript&gt;

var x = "";
var s = "Hello, I am the typewriter.";
var s1 = "";

function Test() {
s1 = ""
document.getElementById("my_span").firstChild.data = s1;
x = setInterval('AddChar()',200);
}
function AddChar() {
if (s1.length &gt;= s.length) {
clearInterval(x);
}
else {
s1 = s1 + s.substr(s1.length,1);
document.getElementById("my_span").firstChild.data = s1;
}
}
&lt;/script&gt;

&lt;/head&gt;

&lt;body&gt;
&lt;style&gt;
.my_class {font-family:monospace; font-size:15pt; font-weight:bold; color:Black;}
&lt;/style&gt;
&lt;input type="button" value="Test" onclick="Test();"&gt;
&lt;br&gt;&lt;br&gt;
&lt;span id="my_span" class="my_class"&gt;?&lt;/span&gt;
&lt;/body&gt;
&lt;/html&gt;
Copy linkTweet thisAlerts:
@musicfanauthorFeb 26.2005 — thanks Pittimann and herodote92,I can do now.
Copy linkTweet thisAlerts:
@PittimannFeb 26.2005 — From my side: you're welcome. Good typing! ?

Cheers - Pit
Copy linkTweet thisAlerts:
@herodote92Feb 26.2005 — This version is even more funny: the script will type itself on the screen (I made the typing speed a little faster...):
<i>
</i>&lt;html&gt;
&lt;head&gt;
&lt;title&gt;&lt;/title&gt;

&lt;/head&gt;

&lt;body&gt;
&lt;style&gt;
.my_class {font-family:monospace; font-size:10pt; font-weight:bold; color:Black;}
&lt;/style&gt;
&lt;script language=javascript&gt;
var x = "";
var s = document.getElementsByTagName("script")[0].innerHTML;
var s1 = "";
var i = 0;

function Test() {
s1 = "";
i = 0;
document.getElementById("my_pre").firstChild.data = s1;
x = setInterval('AddChar()',50);
}
function AddChar() {
if (i &gt;= s.length) {
clearInterval(x);
}
else {
var my_car = s.substr(i,1);
s1 += my_car;
i += 1;
document.getElementById("my_pre").firstChild.data = s1;
}
}
&lt;/script&gt;
&lt;input type="button" value="Show yourself ! (if you dare)" onclick="Test();"&gt;
&lt;br&gt;&lt;br&gt;
&amp;lt;script language="javascript"&amp;gt;
&lt;pre id="my_pre" class="my_class"&gt;?&lt;/pre&gt;
&amp;lt;/script&amp;gt;
&lt;/body&gt;
&lt;/html&gt;


?
Copy linkTweet thisAlerts:
@the_treeFeb 26.2005 — LOL Brilliant ? Go useless scripts!
×

Success!

Help @musicfan spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...