1

I have the normal react particle code which works fine but after adding an image to the background the particles are not interacting on hover anymore. Image is in y.js file which is loaded in x.js file where react particles code exists

const ParticleOptions={

  particles: {
    number: {
      value: 170,
       density:{
        enable: true,
        value_area:850

      }  
    }
},

 interactivity:{
  detect_on:"canvas",
  events:{
    onhover:{
      enable:true,
      mode: "repulse"

    }
  },
   modes:{
    repulse:{
      distance:70,
      duration: 0.4
    }
   }
 }

}

My separate image in a different JS file:

return(
        <div className='abx'>

        <img src='https://samples.clarifai.com/face-det.jpg' alt=''/>

        </div>



        );

I expected thr interaction of particles on mouse movements to remain after adding a small image to the center but it does not

4

1 回答 1

0

只需将detect_on:“ canvas ”更改为窗口

于 2021-08-20T15:54:04.760 回答