gopatrik / space.js

A HTML-driven JavaScript-library for narrative 3D-scrolling.
www.slashie.org/space.js
MIT License
1.37k stars 129 forks source link

Transition "Wiggling" in Chrome #1

Open alacritythief opened 9 years ago

alacritythief commented 9 years ago

Thanks for making space.js! I've been testing it out, and I wanted to note a visual glitch I see in Chrome, but not Firefox:

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <script type="text/javascript" src="jquery-2.0.2.min.js"></script>
  </head>
  <body>
    <div class="space-frame" data-duration="1">
      <section class="space-inner-frame">
        <!-- Clear frame -->
      </section>
    </div>

    <div class="space-frame" data-enter="fadeIn" data-exit="fadeOut" data-transition="fadeIn" data-duration="5">
      <section class="space-inner-frame">
        <p>Demo 1</p>
      </section>
    </div>

    <div class="space-frame" data-enter="slideInRight" data-transition="rotate360" data-duration="5">
      <section class="space-inner-frame">
        <p>Demo 2</p>
      </section>
    </div>

    <div class="space-frame" data-enter="slideInLeft" data-transition="rotate360" data-duration="5">
      <section class="space-inner-frame">
        <p>Demo 3</p>
      </section>
    </div>

    <script type="text/javascript" src="space.min.js"></script>
  </body>
</html>

The text tends to "wiggle" up and down while scrolling to the 2nd and 3rd transitions, and I'm trying to hone down what's causing it.

gopatrik commented 9 years ago

Oh! You're right! Thanks for reporting! No problem in Safari either! Looking into it! I think Chrome has their own implementation of scrolling.