Stack Overflow
Stack Overflow

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
9
votes
1 answer

Is it possible to parallax an img tag rather than background image in a div?

I've come across a number of parallaxing tutorials (this one in particular I'm looking at now: http://net.tutsplus.com/tutorials/html-css-techniques/simple-parallax-scrolling-technique/); however, they all seem to involve a background image in a…
Matt
  • 2,317
  • 7
  • 41
  • 52
9
votes
5 answers

HTML5 / Javascript Parallax Effect on single elements / div tags?

I have created a few sites in the past with the scrolldeck.js that have the standard full screen background with one layer ontop and text (the standard scroll parallax style) this is not what I am looking for. Im looking for a script or tutorial (or…
matt
  • 1,015
  • 4
  • 14
  • 28
8
votes
6 answers

jQuery parallax tutorial?

I need to use a jquery parallax in a website I am building for a client, I am mainly a back end developer so I'm learning more about front end and jquery etc. I have came across examples such as http://www.nikebetterworld.com/ and tutorials however…
green_arrow
  • 1,257
  • 7
  • 21
  • 37
8
votes
2 answers

CSS only Parallax Scrolling stoped working with IOS/PadOS13?

Okay so I’m quite new in the World of Web development. I finished my own Website with Css only Parallax Scrolling a few month ago. Some Problems came with the IOS13. For the Parallax Effect, i used the Description of Keith Clark. Everything went…
tinoliv_xcix
  • 91
  • 4
8
votes
3 answers

Parallax scrolling – decrease height of container to match transform gap

I have an arrangement of elements on the page – positions controlled via a CMS which gives each element a width, top position, left position, z-index and 'speed'. The speed is used to create a parallax effect using JS. It takes it's 'speed' and…
John the Painter
  • 2,495
  • 8
  • 59
  • 101
8
votes
1 answer

Set initial height of parallax image in CollapsingToolbarLayout

I have an Android activity which uses a CollapsingToolbarLayout inside a CoordinatorLayout to achieve a scrolling / collapsing toolbar with an image as the backdrop / banner. The image is loaded from the internet and I don't know its size…
Nick Thissen
  • 1,802
  • 4
  • 27
  • 38
8
votes
0 answers

Collapsing layout in a tool bar with Images and text and icons in Android

I was trying a custom activity as like Whatsapp Group Profile page, where I need to place , 1 Image in left and two text in a layout to the right of image and two icons in the right. The collapsing layout which is currently available is with…
Sriram C G
  • 931
  • 13
  • 24
8
votes
1 answer

How to fix parallax window scroll overflow?

i am using parallax.js v1.3 on the picture in the head of my page. Please help me find out why when i scroll down the picture overflows. When i load the page the picture is slightly distorted as if it was enlarged too much. When i scroll down the…
Gunnit
  • 1,064
  • 5
  • 22
  • 45
8
votes
1 answer

Non-jumping parallax with IE11 - but how?

On my website, I experience - and a lot of others do on theirs - a kind of jumping/lagging effect with Internet Explorer 11 (on a Windows 8.1 machine) when creating a parallax. On Firefox for example it is working absolutely fine. According to my…
Gnarlund
  • 115
  • 1
  • 6
8
votes
1 answer

Understanding why pure CSS parallax effect works with div, but not body tag?

I am trying to understand the Pure CSS Parallax effect Keith Clark demonstrates on his website in this article. Take these two jsFiddles: CSS Parallax with div and CSS Parallax with body. The first one works as described, the second one does not -…
marked-down
  • 9,958
  • 22
  • 87
  • 150
8
votes
3 answers

Background video with parallax effect

Is there a way to place a background video in a div container with a parallax effect? What I'm looking for is something similar to this template: Click here to see example I've tried a few popular plugins I've found on the internet such…
Nesta
  • 988
  • 2
  • 16
  • 44
8
votes
0 answers

Parallax Shadows in iOS 7

I was originally seeking the answer to this question, but before I could ask it, the solution occurred to me, and it works perfectly. Basically, my question way, under iOS 7 can you have a shadow layer that moves with parallax? The answer is yes,…
Owen Godfrey
  • 3,361
  • 2
  • 22
  • 18
8
votes
1 answer

Terrible lag in Chrome when using parallax effect

first of all, here's a link to my website, having the issue I'm about to describe: http://themes.roussounelosweb.gr/cassiopeia/ In Firefox, IE 9, Opera, Safari, iOS the website looks perfect, and runs smoothly. The problem lies with Chrome and…
Νίκος Ρουσσουνέλος
  • 89
  • 1
  • 2
  • 9
8
votes
3 answers

how to stick the footer to the bottom of the page while moving it upward in a parallax-like effect?

I have a project where the requirement is to move the footer ( #footer ) upward while scrolling down the page in a parallax-like effect. When you start scrolling down the page, the footer should start moving upward only until it's visible in the…
JFK
  • 40,963
  • 31
  • 133
  • 306
8
votes
5 answers

Android Parallax Effect and View Pager

I'm trying to achieve a parallax effect in my application. I have a FragmentActivity that implements the OnPageChangeListener interface and listens to my ViewPager scrolling events. To achieve this effect in my XML I have a LinearLayout behind all…
user1305336
  • 151
  • 1
  • 1
  • 12
1 2 3
…
99 100