Java script type effect Options

[asmith]

Hey guys

I'm searching for some JAVA script code, which make my HTML paraghraph appear on the page like "typing" , meaning characters of the paragraph appear on the page one by one, exactly like someone is typing them.

any idea ?

thanks in advance

[Frederiek]

Like this: http://www.javascriptkit.com/script/cut136.shtml?

[pandy]

http://www.scintilla.utwente.nl/frederiek

[asmith]

xD yea both link are almost what i wanted. (exactly i wanted a delay between some characters, just like someone types).

thanks a lot.

the thing on my mind is i want to put them on that nicol stu tabbed pages.
wanna check it if i click on each tab , the content would be shown like this typing thing.

[Frederiek]

http://www.scintilla.utwente.nl/frederiek

ha, ha, how the … did you find that, Pandy?
Apparently, there are other women in the Netherlands with the same name as mine, I only have seen that once in a magazine.
Anyway, thanks for a good laugh tonight!

[Frederiek]

xD yea both link are almost what i wanted. (exactly i wanted a delay between some characters, just like someone types).

thanks a lot.

the thing on my mind is i want to put them on that nicol stu tabbed pages.
wanna check it if i click on each tab , the content would be shown like this typing thing.

Slow down the speed then, as hardly anyone types as fast as that.

[Christian J]

http://www.scintilla.utwente.nl/frederiek

ha, ha, how the … did you find that, Pandy?
Apparently, there are other women in the Netherlands with the same name as mine, I only have seen that once in a magazine.
Anyway, thanks for a good laugh tonight!

http://www.scintilla.utwente.nl/pandy

[pandy]

Aw, did you have to spoil the fun?

[Frederiek]

Alright, here you go… http://www.scintilla.utwente.nl/christian

Pandy, no, it was fun anyway.
How did you know?

This post has been edited by Frederiek: Jun 5 2008, 04:03 PM

[asmith]

i put the
http://www.scintilla.utwente.nl/frederiek

in ncol stu tabbed pages, it is not working, should i add something more to it ?

(i want when i click on a tab , it show its content like this typing effect then stop when it get finish , not repeating)

[Frederiek]

Can you show us a page (url) that demonstates your attempt?
For the typing to stop, you need to alter the script.

[pandy]

Oops! I'm not sure that script is up for grabs.

[asmith]

Can you show us a page (url) that demonstates your attempt?

I have a tab page like the nicol stu's. In each tab there's an image float left and some text beside it and under it. (again like Nicol's).

I want it to when i click on a tab title, it shows the content like that typing effect.

Again when the tab is clicked, it shows the image, and began to type the text (next and under the image) like the typing and stop when it finishes the end of the paraghraph.


@pandy, yea i faced that , My FF showed it quick then gave " page not found" , but IE opened the page fine.

[Frederiek]

I understand what you want, I know Stu Nicholls' tabbed pages. But I'd rather not have to put everything together, as I personally don't have any use for it, thinking you already did that. Do you have it working now? If not, can you post an url of a test page? Make sure you haven't forgotten to put the type_text() function in the body onload.

As for the text to stop typing, try this:

CODE

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()",1500);
            }
      } else {
        setTimeout("type_text()",speed);
    }
}

[asmith]

As it types the string in a form textarea. So i guess i have to put this textarea in every div (every tab content). and as the strings are stored in an array, each line goes to each array value, so i did put all the contents in the array, so the main array consist of smaller arrays which are tab pages content.

i uploaded them here :

http://www.dpxclan.com/example/type.html

still it has work.
this image inside (like float left) has made this thing a little harder. as i guess i have to put 2 textareas, one on the left of the image and a bigger one at its bottom.

and i guess i have to put onclick event for each tab.

That's all i know to do. :/

Thanks for taking time


P.S : tabs are not working now :s

This post has been edited by asmith: Jun 10 2008, 02:07 AM

[Frederiek]

The javascripts in the page itself need to be thoroughly tweaked.

You can't write arrays like you did and the type_text() function only calls upon one array, while in your case the correct array should be called upon depending on the tab clicked. Even the onload call is out of the question here.

So, you'll need a solid knowledge of javascript to accomplish that. Are you up to that?

The onclick on tabs, btw, are ruled by the tabbed_pages.js.

[asmith]

the array i made, is from what i know from PHP language, unfortunately I can understand Javascript good, but almost i know nothing more.


"Are you up to that?" , don't know what you mean by this. I'm up to learn everything. I never copy paste codes on my page, i have a rule, first i figure it all out, then i use it somewhere.

If you just help me, i'll go through it. The thing is i really really want to do it.

[Frederiek]

he array i made, is from what i know from PHP language, unfortunately I can understand Javascript good, but almost i know nothing more.

"Are you up to that?" , don't know what you mean by this. I'm up to learn everything. I never copy paste codes on my page, i have a rule, first i figure it all out, then i use it somewhere.

So you *are* up to it, since you more or less understand javascript and are willing to learn more. That's what I meant or it's at least a good starting point.

You'll need to create a new array for each (in this case) painter. Then you'll need to use a function argument parameter (in fact some sort of variable), which changes the value, which call the corresponding array, depending on which tab is clicked.

That's the basic idea. I might look into it, but I won't promess anything, as I don't have the time for it. Besides, I don't write that much javascript anymore as I used to.

[asmith]

thanks, well i will do this :

i split that big array, and make different arrays for each tab content.

now i uess by clicking each tab link i activate type_text(), but as onclick is used by tab, maybe i put the type_text() IN THE tab java code function. so that when the tab function has run , it run the type_text() too.

it is just theory, i go try it. But please help me with the changes i have to make in the java codes!

[asmith]

ok, i did the changes, i put the text_type function in the tabbed_pages.js file instead of onload for body.

i made 5 different array for each tab page with the artist name.

now when i click on the one tab , it starts to type the content.

I don't know the java syntax to tell him , when the tab x is selected , put array x content in the textarea, can you give me a hand ?

i uploaded that here :
http://www.dpxclan.com/tabWithType/tabbed_pages.html

P.S it also do not type the second line, don't know why :/