Interfering with background images in chrome.

[goosehub]

I tried to integrate textillate with my website. The animation worked, but on Chrome the background images no longer behaved correctly. They were stuck in place like regular images, and would jump after a bit of scrolling.

I stripped everything out of my website until I was left with just this standard textillate function

$(function () {
    $('#headline').textillate(
      { in: { effect: 'rollIn' } }
      );
    $('#sub-headline').textillate(
      { in: { effect: 'rollIn' } }
      );
  })

and this css of the element class with a background image

.emphasis-peekhole {
    padding: 0.5em 0 0.5em 0;
    border: 1px solid #888;
    border-radius: 1em 2em 2em 4em;
    font-family: BebasNeue, AveriaSerif-Regular, ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;
    font-weight: bold;
    text-shadow: 0.05em 0.05em 0.05em #FFF;
    background: url('../resources/images/clouds.png') no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

The problem persisted. My HTML is valid

Is this a known textillate issue?

[brehouse]

I also have the same issue with my site. Works fine in other browsers. It's a shame because it prevents me from using this sweet plugin.

[goosehub]

I actually left out the background images and kept the textillate, but for most cases, textillate would have to go. I hope someone can shine some light on the cause. I'll look into in the next project where I use textillate.

[dmitrijs]

Same problem here :( "background-position: fixed;" + "textillate" cause weird behaviour in Chrome.