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
0
votes
3 answers

Parallax from Materialize no showing image

Im using Materialize CSS and im trying to use the Parallax. I followed the instructions: http://materializecss.com/parallax.html But when i save, no image is shown. Here is the codepen: https://codepen.io/wecarrasco/pen/qmxMox
0
votes
0 answers

How to add different scroll speeds to HTML elements?

I am trying to replicate an effect in which, when the user scrolls, the objects scroll at a slower speed giving a parallax effect. A perfect example of what I'm trying to make is at this website (https://universe.openai.com). Although it is…
John Doe
  • 305
  • 1
  • 2
  • 10
0
votes
1 answer

Good looking parallax without configuration

I need to setup a section of a template I'm building out for a client that contains a parallax. This means I wont always know where that section will end up on the page. This creates a problem, the y-axis of my parallax is often off because the…
Brendan Jackson
  • 305
  • 1
  • 3
  • 13
0
votes
1 answer

Parallax based on mousemove has different offset

How can I have the same parallax offset in all the sections? Right now the offset increases as you add more sections. Note that in section .two and .three the parallax is different from section .one. I want section .two and .three to have the same…
Diego Oriani
  • 1,647
  • 5
  • 22
  • 31
0
votes
1 answer

how to remove the extra space left at the end of the page in javascript parallax

I am working on a project and i used a parallax for images and for some div's but because of some reason there is some space is left at the end of the parallax. Please help me to remove the space at the end of the page here is the link to the…
sahil raj
  • 1
  • 5
0
votes
0 answers

My parallax is laggy and I've built it with CSS only

I thought making my parallax CSS only would make things less laggy, but seems not. If you wanna check out the code and tell me if there's something done poorly, I'd be thankful. the html:
Andy
  • 49
  • 8
0
votes
1 answer

Parallax not working when being redirected from another page?

So I have an application that uses parallax and it is being executed once the document is ready Javascript: $(document).ready(function(){ parallax(); }); function parallax() { $('.parallax').parallax(); } navbar.html.erb:
0
votes
1 answer

Parallax page anchor links updating URL, causing issues with browser navigation

This is a single page website with navigation consisting of anchor links to different sections of the page. When the navigation is clicked URL updates to ex.(.com/#photos) and makes the browser add as a new page for each anchor link clicked. This…
0
votes
3 answers

how to achieve rotating background on scroll

folks I want to make a demo design of this and I got confused how to achieve this. should I go for parallax scrolling or should I prefer skrollr or scrollmagic or just simple css with few jquery code? suggest the simplest way to achieve this. Thanks…
user7435594
0
votes
0 answers

CSS: parallax effect makes wrapper take bigger size in chrome

I've been trying for hours how to fix a bug that is happening only on chrome. There are 2 layers in a wrapper, which are: Parallax background Normal content scrolled i've been doing parallax effect by using translateZ and scale rules, everything…
Oscar Reyes
  • 4,223
  • 8
  • 41
  • 75
0
votes
1 answer

How should I force an element to remain fixed with parallax scrolling?

Abridged Codepen below. I'm trying to model a page after this BBC article from way back, but I can't seem to get my image to go to position fixed based off scrolling. I'm thinking that if I can get the element to be position: fixed then I can swap…
Sean Kelly
  • 901
  • 7
  • 27
0
votes
1 answer

Multilayer parallax background

I'm looking to do a parallax effect like this. https://medium.com/@PatrykZabielski/how-to-make-multi-layered-parallax-illustration-with-css-javascript-2b56883c3f27 However, I don't quite understand all the fancy stuff/scripts used in this, like HAML…
ticklishoctopus
  • 63
  • 1
  • 10
0
votes
1 answer

CSS multiple fixed background psuedo elements

I am trying to create a parallax scrolling effect using only CSS and with no third party libraries. Using background-attachment: fixed I was able to achieve the effect I wanted on multiple full-width divs on my page. Using that, however, negatively…
topherlicious
  • 173
  • 3
  • 13
0
votes
1 answer

reloading capcha landing to top portion not to the capcha portion

I am using simple captcha code in my contact form.
Nakshatra
  • 45
  • 1
  • 11
0
votes
1 answer

how to create parallax effect like viber profile using coordinate layout

I want to get the parallax effect used in viber profile/ android contacts. I have seen it can be done using custome class, but is it possible to do it with coordinate layout? Edit 1: I have already done this. preview What I want more is to make the…
Masudul Hasan
  • 137
  • 2
  • 17