PDA

View Full Version : Why does my script repeat once ????



pcbrainbuster
02-23-2007, 08:24 AM
Hello all :),

The following script when your mouse over the text it stretches out a little but when you move your mouse out t stratches back !!!
But all that only repeats once for some reson can anyone tell me what's wrong :)

<html>
<head>
<body>
<span id="zx" onmouseover="e()" onmouseout="asd()">I used to</span><br>
<span id="cv" onmouseover="w()">Hate</span><br>
<span id="bn" onmouseover="q()">You</span><br>


<script>
var a = 0
var aa = 10
function e() {
if (a<aa) {
a++
document.getElementById('zx').style.letterSpacing=a
pokli = setTimeout("e()",50)}
}

var d = 9
var dd = 0
function asd() {
if (d>dd) {
d--
document.getElementById('zx').style.letterSpacing=d
aoposido = setTimeout("asd()",50)}
}
</script>


<script>
var b = 0
var bb = 10
function w() {
if (b<bb) {
b++
document.getElementById('cv').style.letterSpacing=b
askli = setTimeout("w()",50)}
}
</script>
<script>
var c = 0
var cc = 10
function q() {
if (c<cc) {
c++
document.getElementById('bn').style.letterSpacing=c
asop = setTimeout("q()",50)}
}
</script>
</body>
</head>
</html>

It was just a test so don't expect so much and also just focus on the I used to part on the script seeing as how it's the only string with the mouseout and mouseover events set....

Thanks for your time:)

pcbrainbuster
02-23-2007, 09:29 PM
So c'mon people i need some and some here!!!

mburt
02-23-2007, 09:41 PM
1. Your <body> tag DOES NOT belong in your <head>.
2. You don't need seperate script tags for each function.
3. Use the type="text/javascript" attribute on your <script> tags

<script type="text/javascript">
var a = 0
var aa = 10
function e() {
if (a<aa) {
a++
document.getElementById('zx').style.letterSpacing=a
pokli = setTimeout("e()",50)}
}

var d = 9
var dd = 0
function asd() {
if (d>dd) {
d--
document.getElementById('zx').style.letterSpacing=d
aoposido = setTimeout("asd()",50)}
}

var b = 0
var bb = 10
function w() {
if (b<bb) {
b++
document.getElementById('cv').style.letterSpacing=b
askli = setTimeout("w()",50)}
}
var c = 0
var cc = 10
function q() {
if (c<cc) {
c++
document.getElementById('bn').style.letterSpacing=c
asop = setTimeout("q()",50)}
}
</script>

You should try to validate your pages as well.

pcbrainbuster
02-23-2007, 11:19 PM
Thanks for replying,

But my script still does the same thing, the body can be in between, and i just kept repeating the functions between new script tags because it is easier for me to manage it that way:)

So do you know what is wrong???

mburt
02-23-2007, 11:26 PM
The following script when your mouse over the text it stretches out a little but when you move your mouse out t stratches back !!!


<span id="zx" onmouseover="e()" onmouseout="asd()">I used to</span><br>
Remove that.

pcbrainbuster
02-24-2007, 04:13 PM
Lol :) you got it wrong i was just emphazing on what i can do, that was intended to do that but the whole thing just happens once.

What i mean is that you put your mouse on it and it stretches out take your mouse out it stretches back but put your mouse on again and it does not work, that is the issue:)

Got any idea??

mburt
02-24-2007, 04:29 PM
You did not clear your initial timeout when you mouseover for the second time. The two timeouts are conflicting with each other. Use clearTimeout(timeid) to remove timeouts.

pcbrainbuster
02-24-2007, 05:12 PM
Hmm i thought that might be the case but in which way should i do it exactly while you reply i will try on my own...

pcbrainbuster
02-24-2007, 05:17 PM
I tried to set the timeout accordingly but failed to do so,
Mind givin me a hand???:)

pcbrainbuster
02-24-2007, 10:04 PM
Well it seems that in general i do not know how to properly clearTimeout's on every one of my scripts (the ones with timeouts on them) do not repeat a second time.

So it would be VERY appreciated if you could help me :)

mburt
02-24-2007, 10:45 PM
Here's the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript">
var sout = false
var i = 0
var min = i
var max = 10
function slideout(elem) {
if (i < max) {
i=i+1
elem.style.letterSpacing = i + "px"
}
t1 = setTimeout(function() {slideout(elem)},50)
if (i == max) {
clearTimeout(t1)
i = 0
}
if (sout == true) {
clearTimeout(t2)
}
}
function slidein(elem) {
clearTimeout(t1)
if (i > min) {
i=i-1
elem.style.letterSpacing = i + "px"
}
t2 = setTimeout(function() {slidein(elem)},50)
sout = true
}
</script>
</head>
<body>
<span onmouseover="slideout(this)" onmouseout="slidein(this)">I used to</span><br>
<span onmouseover="slideout(this)">Hate</span><br>
<span onmouseover="slideout(this)">You</span><br>
</body>
</html>
You have to understand that neglecting using the type="text/javascript" attribute is unstandard and should be used. Also, for the last time, the <body> does NOT belong in the <head>. The way you were using this function before was very ineffecient, because you had to create a function for each element.

pcbrainbuster
02-24-2007, 11:51 PM
Thanks for your response:),

But still it had some issues -
1) It did not automatically go back the way needed

And i looked at your scrpt and got the main idea of the clearTimeout part,
So thanks about that and i will try to use it on my version of the script and report back:) - By the way i am using IE7

pcbrainbuster
02-24-2007, 11:59 PM
Well again my tests had failed:(,

Here is the edited code -

<html>
<head>
<body>
<span id="zx" onmouseover="e()" onmouseout="asd()">I used to</span><br>
<span id="cv" onmouseover="w()">Hate</span><br>
<span id="bn" onmouseover="q()">You</span><br>


<script>
var a = 0
var aa = 10
function e() {
if (a<aa) {
a++
document.getElementById('zx').style.letterSpacing=a
pokli = setTimeout("e()",50)}
if (a==10) {
clearTimeout(pokli)}
}

var d = 9
var dd = 0
function asd() {
if (d>dd) {
d--
document.getElementById('zx').style.letterSpacing=d
aoposido = setTimeout("asd()",50)}
if (d==0) {
clearTimeout(aoposido)}
}
</script>


<script>
var b = 0
var bb = 10
function w() {
if (b<bb) {
b++
document.getElementById('cv').style.letterSpacing=b
askli = setTimeout("w()",50)}
}
</script>
<script>
var c = 0
var cc = 10
function q() {
if (c<cc) {
c++
document.getElementById('bn').style.letterSpacing=c
asop = setTimeout("q()",50)}
}
</script>
</body>
</head>
</html>

In this one it is pretty much the same (don't mind the second and third script tags so i am just saying mind the first one (the longer one) seeing how that's the one i am focusing on...)
I just don't seem to understand what is wrong - well while then i will have a focused look at your version...:)

pcbrainbuster
02-25-2007, 12:51 AM
Still got no idea how it works:(

pcbrainbuster
02-25-2007, 04:10 PM
Please Explain:)

Blake
02-25-2007, 05:11 PM
EDIT: Oops, I accidentally replied to the wrong thread.

mburt
02-25-2007, 05:24 PM
You must make an exception before you clear the second time out. This is causes an error because the function hasn't been called yet, therefore there is not setTimeout to clear. When you mouseover, like in my example, sout = false, but when you mouseout sout = true. When the original function is written I threw in this:

if (sout == true)
clearTimeout(timeid);
So that it wouldn't jump to the second function and try to clear that.

pcbrainbuster
02-25-2007, 05:55 PM
Grrrr:mad:

Can you please write my script plus the sout thing in the in the correct place without actaully editing my script to much :) That way i will be able to understand it easier :):)

pcbrainbuster
02-25-2007, 10:27 PM
Please :)

pcbrainbuster
02-27-2007, 07:27 PM
C'mon mburt help please:)

mburt
02-27-2007, 08:09 PM
Okay...

<html>
<head>
<body>
<span id="zx" onmouseover="e()" onmouseout="asd()">I used to</span><br>
<span id="cv" onmouseover="w()">Hate</span><br>
<span id="bn" onmouseover="q()">You</span><br>


<script>
var a = 0
var aa = 10
function e() {
if (a != 0) {a = 0;}
exec();
}
function exec() {
if (a<aa) {
a++
document.getElementById('zx').style.letterSpacing=a
pokli = setTimeout("exec()",50)
}
if (a==10) {
clearTimeout(pokli)
}
if (mouse == true) {
clearTimeout(aoposido);
}
}
var mouse = false
var d = 9
var dd = 0
function asd() {
if (d != 9) {d = 9;}
exec2();
}
function exec2() {
if (d>dd) {
d--
document.getElementById('zx').style.letterSpacing=d
aoposido = setTimeout("exec2()",50)
mouse=true;
clearTimeout(pokli)
}
if (d==0) {
clearTimeout(aoposido)
}
}
</script>


<script>
var b = 0
var bb = 10
function w() {
if (b<bb) {
b++
document.getElementById('cv').style.letterSpacing=b
askli = setTimeout("w()",50)}
}
</script>
<script>
var c = 0
var cc = 10
function q() {
if (c<cc) {
c++
document.getElementById('bn').style.letterSpacing=c
asop = setTimeout("q()",50)}
}
</script>
</body>
</head>
</html>

But again, your use of this function is very ineffecient. You have to write a function for every instance of the use of it.

mburt
02-27-2007, 08:14 PM
A much more effecient version would be:

<html>
<head>
<script>
var a = 0
var aa = 10
function slideout(element) {
if (a != 0) {a = 0;}
exec(element);
}
function exec(element) {
if (a<aa) {
a++
element.style.letterSpacing=a
time1 = setTimeout(function() {exec(element);},50)
}
if (a==10) {
clearTimeout(time1)
}
if (mouse == true) {
clearTimeout(time2);
}
}
var mouse = false
var d = 9
var dd = 0
function slidein(element) {
if (d != 9) {d = 9;}
exec2(element);
}
function exec2(element) {
if (d>dd) {
d--
element.style.letterSpacing=d
time2 = setTimeout(function() {exec2(element)},50)
mouse=true;
clearTimeout(time1)
}
if (d==0) {
clearTimeout(time2)
}
}
</script>
</head>
<body>
<span id="zx" onmouseover="slideout(this)" onmouseout="slidein(this)">I used to</span><br>
<span id="cv" onmouseover="slideout(this)">Hate</span><br>
<span id="bn" onmouseover="slideout(this)">You</span><br>
</body>
</html>
Using "this" to define the element in question, and setting the style to said element. Also, using variable names like pokli are hard to remember, and with bigger scripts will only cause confusion. time1 and time2 are easier to remember.

pcbrainbuster
02-27-2007, 08:48 PM
What right do you have to say that !!!!!!
pokli is the name of my DEAD sister !

I just don't believe you - (she died only 1 week ago :()

mburt
02-27-2007, 09:30 PM
What right do you have to say that !!!!!!
pokli is the name of my DEAD sister !

I just don't believe you - (she died only 1 week ago )
I'm sorry, but how would I know that.

pcbrainbuster
02-27-2007, 09:35 PM
LOL sorry i wanted to have a little laugh i have no sister :)

BLiZZaRD
02-27-2007, 10:09 PM
That's not a good thing to do..

pcbrainbuster
02-27-2007, 10:10 PM
Thats how i started feeling for the first few moments until i got better but seriously bordom can really do "wonders" to a person !!!

(bordom is when your bored)

pcbrainbuster
02-27-2007, 10:11 PM
Oh man, thanks for nuthing blizz you now have accomplished in making me feel bad - sorry mburt :)

techno_race
02-28-2007, 12:51 AM
Thanks for your response:),

But still it had some issues -
1) It did not automatically go back the way needed

And i looked at your scrpt and got the main idea of the clearTimeout part,
So thanks about that and i will try to use it on my version of the script and report back:) - By the way i am using IE7
I've noticed that IE7 doesn't seem to recognize most JavaScript.

pcbrainbuster
02-28-2007, 07:29 AM
Trust me it recognises enough/aloot javascript i use it all the time on ie also if go on overto other sitess ie sometimes has more javascript than others:)

Twey
02-28-2007, 04:37 PM
Er... I'd be a little worried about the mental state of someone who named Javascript variables after dead family members :)

Either way, there is an interesting lesson to be learnt from this: don't criticise other people's choice of variable names :) Dead sister might be a bad example, but they may have a mnemonic meaning in some language or other. I can quite easily imagine myself writing a script (if it were intended for myself) with variable names based on one of my constructed languages. This might have no meaning to anyone else, but that doesn't mean to say it has no meaning at all :)

pcbrainbuster
02-28-2007, 04:41 PM
LOL :)

Am i right to say that you did understand that pokli was a joke ?

Twey
02-28-2007, 05:08 PM
Yes :) Perhaps a more useful joke than intended, though.

Is that an Serbian/Croatian/... name?

pcbrainbuster
02-28-2007, 06:21 PM
Nope :)
I actually smacked random keys !!!

Twey
02-28-2007, 06:36 PM
Hahaha xD

pcbrainbuster
02-28-2007, 06:46 PM
lol - whats xD

BLiZZaRD
02-28-2007, 07:04 PM
xD is a smiley.. basically it means :D only the eyes are closed

Here is one list (http://www.helpbytes.co.uk/smileys.php)

pcbrainbuster
02-28-2007, 07:17 PM
Ok i see xD - lol