Configuration to copy
{
// Configure parameters above, and the config will appear here
}
Copied!
Usage example:
// Option 1: Install via npm
import ParticleEffect from '@fatmax/particle-hide-effect';
// Option 2: Include via CDN
// <script src="https://cdn.jsdelivr.net/npm/@fatmax/particle-hide-effect@latest/dist/particle-effect.umd.js"></script>
const element = document.getElementById('your-element-id');
const config = /* Paste the copied config here */ ;
// Basic usage
const effect = new ParticleEffect(element, config);
// With auto-hiding (new feature)
const effectWithAutoHide = new ParticleEffect(element, {
...config,
autoHideTarget: true, // Enable auto-hiding (default: true)
targetFadeDuration: 0.1, // Duration of fade animation in seconds (default: 0.3)
targetContentSelector: null, // CSS selector for specific content (null = all content)
targetHideClass: null, // Custom CSS class for hiding (null = use inline styles)
targetTimingFunction: 'ease' // CSS timing function
});
// Controls:
// effect.start();
// effect.stop();
// effect.toggle();
// effect.destroy();