Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

No glare effect outside of target when track on window is enabled #82

Open
3 tasks done
eesuhn opened this issue Oct 15, 2024 · 0 comments
Open
3 tasks done

No glare effect outside of target when track on window is enabled #82

eesuhn opened this issue Oct 15, 2024 · 0 comments

Comments

@eesuhn
Copy link

eesuhn commented Oct 15, 2024

Description

The glare effect will not show with trackOnWindow enabled, until the user hover over the tilt card.
This is even reproduceable from your own demo.

Link to Reproduction - Please provide demo in online code editor CodeSandbox or similar. - Issues without a reproduction link are likely to stall.

https://mkosir.github.io/react-parallax-tilt/?path=/story/react-parallax-tilt--track-on-window

Steps to reproduce

  1. Create <Tilt> with glareEnable={true} and trackOnWindow={true}.
  2. Refresh the window, position your cursor outside of targeted Tilt card.
  3. Hover outside of Tilt card, you will notice that the glare effect is not present.
  4. Hover over the Tilt card, and then hover outside of Tilt card again, this time you will notice the glare effect.

Expected behavior

Glare effect should be present at all time when track on window is enabled.

Code snippets

import React from 'react';

import Tilt from 'index';
import './TrackOnWindow.demozap.css';

const TrackOnWindow = () => (
  <Tilt
    className="background-stripes track-on-window"
    perspective={500}
    glareEnable={true}
    glareMaxOpacity={0.75}
    glarePosition="all"
    scale={1.02}
    trackOnWindow={true}
  >
    <div className="inner-element">
      <div>React</div>
      <div>Parallax Tilt</div>
      <div>👀</div>
    </div>
  </Tilt>
);

export default TrackOnWindow;

React Parallax Tilt Version

1.7.246

Browser

All browsers.

Operating System

  • macOS
  • Windows
  • Linux

Additional Information

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant