Return Styles: Pseud0ch, Terminal, Valhalla, NES, Geocities, Blue Moon.

Pages: 1-

Javascript Animation Help

Name: Anonymous 2010-12-13 9:05

Javascript

I'm trying to make a picture bounce between 50px x value, to 200 pixels left of the right boundary. (img is 150px wide, so this would work for top/left corner)

Here is my code:

<script>
var y = 0;
var x = 50;
width = document.body.clientWidth;
var stophere = width - 200;

function animate()
{
while (x < stophere)
{
x += 5;
shiftTo(x, y, 2);
}
}

I have other functions that make the animation actually occur, which it does, but only when I don't use the while statement. Am I doing something wrong with determining the width and setting it to a var?

What I'm trying to do:
Picture with top/left corner at (0,50) ---> Translates right until width - 200

In theory this should be easy...javascript fucking sucks

Name: Anonymous 2010-12-13 9:14

Here, let me fix and indent that for you Motherfucker!!!


<script>
    var y = 0;
    var x = 50;
    width = document.body.clientWidth;
    var stophere = width - 200;

    function animate()
    {
        while (x < stophere)
        {
            x += 5;
            shiftTo(x, y, 2);
        }
    }
</script>

Name: Anonymous 2010-12-13 9:19

Get rid of the while and put animate() in a timer.

Name: Anonymous 2010-12-13 9:26

@2 - It's actually indented in my file, but the copypasta killed the indentation and I cbf lol

@3 - Thanks, I'll try that - As it stands, I've got the function in a timer already in order to delay between each move, so that shouldn't be too hard

function startAnim()
    {
                if (timerID=="")
                {
                   timerID = setInterval("animate()",delay);
                }
    }

Name: Anonymous 2010-12-13 9:29

How would I even set up a timer that moves it until that certain "stophere" point? I'm basing it off pixels, and different resolutions would fuck up the timer in that case wouldn't they?

Name: Anonymous 2010-12-13 9:36

I'm not a JS guy, but something like the following:
function animate() {
  if (x < stophere) {
    x += 5;
    shiftTo(x, y, 2);
  } else {
    /* kill the timer or do the next part of the animation */
  }
}

Also, [code](formatted code)[/code] will preserve the formatting.

Name: Anonymous 2010-12-13 9:39

@6 - Thanks. I don't know what's messed up with the while or if statements, it's like the value in stophere is undefined or something..

Name: Anonymous 2010-12-13 9:42

>>5
Also, if you want the scene to scale with the window size (but keep the aspect ratio), there must be some kind of CSS thing with which you can create a <div> with fixed proportions. Then put everything inside that, and use percentages for coordinates.
Otherwise yes, if stophere is, say, 1000 and the window width is only 800, shit's gonna get fucked up.

Name: Anonymous 2010-12-13 9:44

Thanks for all the help, I figured it out! The worst part is I SWEAR I did exactly this earlier and it didn't work.. facepalm.

I GOT IT!

I fucking SWEAR I tried this earlier to no avail...


function animate()
{
if (x <= 50)
{
change = 5;
}
if (x >= (document.body.clientWidth - 200))
{
change = -5;
}

x += change;
shiftTo(x, y, 2);
}

Name: Anonymous 2010-12-13 9:45

I just re-read >>1
I think document.body.clientWidth is a string with 'px' on the end, and you're trying to subtract a value from a string.

Name: Anonymous 2010-12-13 9:46

Oh okay, that's cool. I have limited experience with this. I'm glad you fixed it

Name: Anonymous 2010-12-13 10:35

Japanese Animation Help

Anime

I'm trying to grep my imouto's chest between 50px x value, to 200 pixels left of the right boundary. (dfc is 150px wide, so this would work for top/left corner)

Here is my code:

       ,、‐ " ̄:::゙:丶、
    ,r::::l3゙::::::::/ハヽ:ヽ::::、:ヽ
    {::://:::::::// ヽ\ト、:::::::!
    ヾ l:::::::/ ノ   `ヾ ィ、:::|
     |;:r::|  O ` ' O ゙ハ|
      ヽハ :.:.    :.: レ
        ´\ r‐--‐、,ノ
        / ヾ ̄下ヘ
       /ヽ、_ヽ/__ .ィヽ
      |  |     .n_n| |
        |  |     l゚ω゚| |
      |  |      . ̄|. |
       |  |  ___ |  |
       |  | ノ     l |  |
     .| .| |      i:|  |


I have other functions that make the animation actually moe, but only when I don't use the while statement. Am I doing something wrong with determining the width and setting it to a var?

What I'm trying to do:
Picture with top/left corner at (0,50) ---> Translates right until width - 200

In theory this should be easy...anime fucking sucks

Name: Anonymous 2010-12-13 11:34

VALID PERL CODE

Name: Anonymous 2010-12-13 22:49

>>1,9
- Global variables
- Missing 'var' declaration
- Using == instead of ===
- Using a loop for animation instead of a timer

Please leave now

Name: Anonymous 2010-12-14 0:34

>>14
r u mad

Name: 2010-12-14 0:43

Name: 2010-12-14 0:43

Name: 2010-12-14 0:44

Name: 2010-12-14 0:45

Name: 2010-12-14 0:45

Name: Anonymous 2010-12-14 1:03

lolol aootist

Name: Anonymous 2010-12-14 1:09

It's simple, you just have to                                                                                                                                                                                         .

Name: Anonymous 2010-12-14 3:15

>>22
you forgot to put text inside your spoiler

Name: Anonymous 2010-12-14 7:54

>>23
you forgot to put sage inside your meiru field

Name: Anonymous 2010-12-14 9:40

>>24
you forgot to put your pooper in the shitcan

Name: Anonymous 2010-12-14 12:03

>>25
you forgot to put uranus in your anus

Don't change these.
Name: Email:
Entire Thread Thread List