Stack Overflow
Stack Overflow

Questions tagged [skrollr]

Skrollr is a stand-alone parallax scrolling library for mobile (Android + iOS) and desktop.

Skrollr is much more than "just" parallax scrolling. It's a full-fledged scrolling animation library. In fact, you can use it and still have no parallax scrolling at all. Skrollr leverages HTML5 and CSS 3. It is not dependent on jQuery - it's just plain JavaScript.

Official site: http://prinzhorn.github.io/skrollr/

Github: https://github.com/Prinzhorn/skrollr

361 questions
26
votes
1 answer

Skrollr init set height to be too high

I used Skrollr library to create parallax effect for the background. However, when skillor.init() is called, the body height is too high and create extra space below in the page. The problem can be seen…
designil
  • 711
  • 3
  • 9
  • 15
21
votes
1 answer

Angular2 Directive: How to detect DOM changes

I want to implement Skrollr as an Angular2 attribute directive. So, the format may be: However, in order to implement this, I need to be able to detect changes in the DOM in child elements below the containing tag (in this…
Tom Mettam
  • 2,454
  • 1
  • 23
  • 30
13
votes
3 answers

Why is skrollr preventing scrolling on ipad?

I'm trying to create a simple parallax animation with skrollr: my site is working well on Chrome/Mac but I'm seeing unusual behaviour on the ipad.. On ipad (testing on the IOS simulator), the main body of the page doesn't skroll at all (or may…
ptim
  • 12,355
  • 8
  • 70
  • 89
10
votes
6 answers

Disable Skrollr for mobile device ( <767px )

Firstly would like to thanks @prinzhorn for such an amazing and powerful library. My question: I have implemented a Skrollr parallax background to the header of my website but I would like to disable this feature when viewed on a mobile device,…
Petef1n
  • 105
  • 1
  • 1
  • 8
6
votes
2 answers

Pause Scrolling to Next 'Slide' till all Animations are complete

I am creating a 'limited' visual builder for Skrollr sliders. It allows the user to build sliders that consist of slides (html section tags) that sit one below each other on the page, each slide contains many html elements that have Skrollr data…
sazr
  • 21,294
  • 58
  • 170
  • 304
6
votes
2 answers

Skrollr not working on mobile devices

so this seems to be a common question, however none of the answers have provided me with any joy. I've fully read the Skrollr Documentation and can conclude I'm totally at a loss here. My basic html markup: …
Matt
  • 1,983
  • 2
  • 25
  • 36
5
votes
1 answer

Audio on scroll

I'm doing a website with the skrollr plugin and I'm almost done with the pictures and scrolling itself, so I'm trying to add the audio now, but I can't seem to make the audio start and stop when I want it to. This is the script I am currently…
Milad Emadi
  • 53
  • 1
  • 4
5
votes
2 answers

How to fix Skrollr on Mobile?

I have followed the guidelines for mobile browser support by wrapping the content in a after and before the body tags. Explination is here: https://github.com/Prinzhorn/skrollr#what-you-need-in-order-to-support-mobile-browsers The site still wont…
Dan Lee
  • 604
  • 3
  • 12
  • 28
4
votes
1 answer

Dynamically set attribute key (e.g. data-{foo}="bar") in React

Setting an attribute in React is straightforward if you know the key, e.g. data-500={this.props.YDistance} but how can one dynamically set part of the key. e.g. data-{this.props.YDistance}="valueHere" var Test = React.createClass({ render:…
Ed Williams
  • 2,157
  • 2
  • 12
  • 19
4
votes
5 answers

How to ignore javascript on smaller resolutions?

My dev site uses lots of Skrollr animation at 1024px resolutions and up. Under 1024px, I don't want the animation to show, so I hid all of the images and whatnot. However, the javascript that gets called to make the animation work is still getting…
user3304303
  • 997
  • 7
  • 25
4
votes
1 answer

what, exactly, does data-anchor-target do?

I'm playing around with Skrollr and for the most part it seems pretty intuitive, the one thing that kind of gets me is the data-anchor-target attribute. Most times I don't need it but when I look at some examples it's usually included and I'm…
Jason Ip
  • 333
  • 1
  • 5
  • 16
4
votes
3 answers

Skrollr run animation once only then stop

How can I run an animation in Skrollr once, and then kill it? I've tried: The beforerender method but that kills all animations Looking for ways to set individual Skrollr instances, but it's a singleton Removing or renaming the object's…
Ben
  • 47,286
  • 44
  • 159
  • 208
4
votes
1 answer

Skrollr - Very choppy animations in Safari

I am building a page with skrollr and it works great! I have it working the way it should in Chrome, Firefox, and IE. However, in Safari 6.0.5 on a mac version 10.7.5 it is very choppy in animating the elements when scrolling. Basically, when I…
Peter
  • 41
  • 1
  • 1
  • 3
4
votes
1 answer

Skrollr: how to start animation only once a certain point is reached?

I'm playing with skrollr plugin but can't achieve what I want so looking for assistance. I've been able to implement easy effects such as
(means that my DIV called intro-left becomes…
Greg
  • 2,937
  • 9
  • 47
  • 96
3
votes
2 answers

White patches appear in the image, and website does not scroll to its full length, skrollr js mobile parallax issue

All below issues are while accessing through mobile. I have used skrollr js for one of my client. There are 4 parallax section in all. The first two images work perfectly, but the third is little blank and last one is almost half blank at…
Zee
  • 91
  • 1
  • 7
1
2 3
…
24 25