Questions tagged [parallax.js]

Simple, lightweight Parallax Engine that reacts to the orientation of a smart device. Where no gyroscope or motion detection hardware is available, the position of the cursor is used instead.

Parallax.js

Simple, lightweight Parallax Engine that reacts to the orientation of a smart device. Where no gyroscope or motion detection hardware is available, the position of the cursor is used instead.

Check out this demo to see it in action!

Homepage: https://github.com/wagerfield/parallax

124 questions
1
vote
2 answers

defining background element using jQuery based on current width

I need to implement a multi- if...else if...else statement in a jQuery plugin for a responsive parallax background image and its position. The code I have so far is: if ($thirdBG.hasClass("inview")){ //call the newPos function and change the…
Ali Samii
  • 1,672
  • 4
  • 28
  • 49
1
vote
1 answer

Empty div with background on Wordpress overlaps ONLY the posts, renders blog useless

I'm trying to setup a blog for our company and decided to go the Wordpress way. I Set out to completely alter a standard theme so that it could encompass everything we wanted. The blog can be found here http://limsomniacs.limsomnium.com it has only…
LIMsomnium
  • 127
  • 1
  • 3
  • 12
1
vote
1 answer

MouseEnter and Mouseleave problems when trying to create a hidden navigation bar

Im trying to create a hidden navigation bar that, when hovered over, grows in width, and when the cursor leaves the navigation bar it shrinks back down to its original width. I'm using jQuery and Parallax.js but no combination of mouseenter or…
0
votes
0 answers

How to disable parallax effect on mobile (touch) devices?

I have a parallax effect written in JavaScript. This effect swings the picture from side to side. I want to disable it for tablets and mobile devices. My JavaScript code for parallax. let bg =…
0
votes
0 answers

Make images in parallax container scale up down responsively

I'm using parallax.js (Github: https://github.com/pixelcog/parallax.js/) to achieve a parallax effect when scrolling. It works fine on laptop screens. However, when I decrease the horizontal screen size the parallax images don't scale down…
Hagelslag
  • 85
  • 8
0
votes
1 answer

How to disable parallax.js on element click

I want these class elements to be deactivated in their current coordinated positions (without resetting the position) when clicked.
0
votes
0 answers

Animating web images from center to to left and right on click

I want to achieve this result of the trees moving from center to left and right on click. I was trying this tutorial but it didn't work at all in translating the first tree from center to left. I am working on the white arrows of the same section…
0
votes
0 answers

Parallax.js only allows the first child element of the parallax container to be styled

I am building a website and have been using Parallax.js by Matthew Wagerfield and it seems that I have a problem: Whenever I try to style the divs inside of the parent parallax container or in this case #scene, only the first instance of the div is…
Pilner
  • 1
  • 1
0
votes
1 answer

Can page load with parallax effect faster in Next.js?

My page get 50% from Google Page Speed: https://tikex-dev.com The template page I replicating get 72% on desktop. http://themes.framework-y.com/codrop/music/ Why they page load faster? I see a black flash when loading the page in the parallax effect…
János
  • 32,867
  • 38
  • 193
  • 353
0
votes
1 answer

How to pass custom html attributes in Next.js?

When I pass following attributes, Next.js raise warning. Is it a way to avoid?
and the warning message: next-dev.js?3515:24 Warning: Extra attributes from the…
János
  • 32,867
  • 38
  • 193
  • 353
0
votes
2 answers

How to add text over parallex scroll(jquery plugin)

I was using the jquery plugin:- https://github.com/pixelcog/parallax.js/, to create a parallax scroll in a website. I installed parallax using npm and also included:-
0
votes
0 answers

parallax library not working in component (Vuejs)

im trying to install the universal parallax library, however when i call in my component nothing appear. no error appear also, can anyone help me? i would really appreciate, im not sure what is causing the issue but kindly help. This is the…
TechDev
  • 415
  • 5
  • 18
0
votes
1 answer

Scaling image in Parallax.js

I apologize in advance for my English, I'm using Parallax.js on my page and I ran into the following problem. The picture that I use to create the parallax has a resolution of 3160x2840 but my screen is 1920x1080. Is it possible to make this photo…
idk
  • 1
  • 1
0
votes
2 answers

Parallax.js displays expected behavior on desktop and ios devices but not working on android devices

I implemented the tool as per the instructions at https://pixelcog.github.io/parallax.js/ (also watched a YouTube tutorial on it before that). It works perfectly on desktop sites (and shows graceful degradation on iOS devices as expected). However,…
SJB
  • 117
  • 1
  • 2
  • 11
0
votes
1 answer

Parallax with mouse

I'm trying to 'transform' elements, img here when the mouse moves on the page. I have integrated a vanilla code to create this effect and thought I understoond it but it seems I was wrong. The element from the code snippet is the orange square…
KV2uAj7c5
  • 15
  • 7
1 2 3
8 9