Questions tagged [parallax]

An effect that causes the position or direction of an object to appear to change when viewed from different positions, e.g., through the viewfinder and the lens of a camera

par·al·lax

noun /ˈparəˌlaks/  parallaxes, plural

The effect whereby the position or direction of an object appears to differ when viewed from different positions, e.g., through the viewfinder and the lens of a camera.

The angular amount of this in a particular case, esp. that of a star viewed from different points in the earth's orbit.

Parallax scrolling is a special scrolling technique in computer graphics, wherein background images move by the camera slower than foreground images, creating an illusion of depth in a 2D video game and adding to the immersion.

source

2209 questions
5
votes
2 answers

CSS Parallax Background Image White Space in IE

I'm using Keith Clark's CSS-only method to create a two-layer parallax effect so that the background image scrolls at a slower speed than the rest of the site's content. Just to be clear, the image covers the entire page and the content sits on top…
5
votes
1 answer

2D List with RecyclerView in HorizontalScrollView

I am trying to build a view which will allow the user to scroll an Excel-like structure both horizontally and vertically. My initial idea was to put a RecyclerView (with LinearManager) into a HorizontalScrollView. But it does not seem to work. Here…
Kelevandos
  • 7,024
  • 2
  • 29
  • 46
5
votes
1 answer

Jquery Parallax Effect Algorithm

I'm developing a very simple parallax effect algorithm for a webpage. I don't want to use plugins or large libraries for this effect, since they are too bulky for my purposes. I just want a simple function that works with every background image on a…
denoise
  • 1,067
  • 2
  • 14
  • 40
5
votes
1 answer

jQuery - Treat multiple instances of the same class separately?

Goal: I'm trying to create a parallax scrolling effect. The parallax-container are implemented like so: < div class="parallax slide-1" > < /div > I need the parallax effect to start, when its container is scrolled into view. Once it has left the…
Arrowcatch
  • 1,612
  • 3
  • 19
  • 26
5
votes
4 answers

How to create parallax effect like this?

I've been trying to get build a website with a parallax effect like the one on this website: http://www.sparksandhoney.com/the-open-agency-index/ or http://www.sparksandhoney.com/press-index/ I've been trying to use stellar.js, but I can't seem to…
5
votes
1 answer

Scroll Background Relative to Page

This is my first time on Stack Overflow, so I apologize if my question is a bit verbose. I have a bit of a quandary: I want to create this parallax-scrolling effect where the background image (the height of which is larger than that of the window)…
user3553106
  • 69
  • 1
  • 5
5
votes
2 answers

Parallax scroll effect with video

I'm learning about the parallax effects and I'm trying to display a video in background instead of an image. So, I created a good effect using a background image. This is my jQuery code: $('[data-parallax]').each(function(){ var $this = $(this), …
Caio Tarifa
  • 5,973
  • 11
  • 46
  • 73
5
votes
1 answer

javascript how to move element on route on scroll

I have a route like a vertical snake. (like this http://www.my-favorite-coloring.net/Images/Large/Animals-Reptiles-Snake-31371.png ) How I can move element (circle 10x10) on route by X and Y position on scroll? Horizonal is ok : var coin =…
Isis
  • 4,608
  • 12
  • 39
  • 61
5
votes
0 answers

requestAnimationFrame Parallax Scrolling

I'm building a site with parallax scrolling backgrounds similar to the spotify.com homepage. I'm using transform3d to move the images around and thought I'd wrap the animation in requestAnimationFrame for improved performance. Works great in Chrome…
fatlinesofcode
  • 1,647
  • 18
  • 22
5
votes
3 answers

Parallax view scrolling (Yahoo weather like)

This is not strictly a programming question but more "how to accomplish this" question. I am curious (and working on an app that will probably require this) how is left-right parallax scrolling implemented. To know exactly what I mean check the…
Majster
  • 3,611
  • 5
  • 38
  • 60
5
votes
3 answers

Skrollr - How to stop the div stop scrolling when reaching top ot window

I am trying to make my website using Skrollr (javascript library): http://prinzhorn.github.io/skrollr/ The scrollr works fine, but I am not able to figure out one thing. How do I stop a div scrolling further away from the top of the screen. Once the…
ssdesign
  • 2,743
  • 6
  • 37
  • 53
5
votes
1 answer

element with scrollLeft is scrolling faster than the rest of the document

I have an element which has a fixed position, but has the ability to scroll left and right using a jQuery calculation which I used from this example on JsFiddle. $(window).scroll(function(event) { var x = 0 - $(this).scrollLeft(); var y =…
Olly Bradshaw
  • 83
  • 1
  • 4
5
votes
1 answer

Horizontal Parallax Scrolling UIScrollView iOS

I'm trying to implement horizontal parallax on a paging scroll view which makes it so that one view appears to advance faster in the x direction but "lands" in the same spot (for example, say (0,0)). Here is my general setup / view…
nmock
  • 1,907
  • 2
  • 20
  • 29
5
votes
0 answers

Parallax Scrolling is Choppy in Safari only

I currently am working with a web company who has coded most of my website. They are about to hand the site off to me however there is an issue with the parallax scrolling in Safari; Works great in all other browsers. Also, I have a widget on the…
P M
  • 51
  • 1
  • 2
5
votes
1 answer

Parallax - Getting text to scroll at 1/10th speed

I am trying to get the text to scroll at the same speed as its parent div (which is scrolling at 1/10 speed). Currently, it is scrolling at normal speed. What am I doing incorrectly? HTML:

blah blah…

Jon
  • 8,205
  • 25
  • 87
  • 146