Toggle switch with quantum superposition effects. Features wave function collapse, particle emission, and quantum field visualization.
Complete quantum effects: superposition, wave collapse, particle emission, and field visualization.
Small, medium, and large sizes with proportional quantum effects.
Traditional toggle without quantum effects - standard smooth transition.
Experiment with different quantum parameters and observe the effects in real time.
This component visualizes several quantum mechanical concepts:
<l-quantum-toggle
checked
size="large"
color-on="#00ff80"
color-off="#ff4444"
quantum-mode="true"
superposition-enabled="true"
particle-count="12"
transition-speed="1.5"
glow-intensity="1.2"
label="Quantum State">
</l-quantum-toggle>
<script>
const toggle = document.querySelector('l-quantum-toggle');
// API Methods
toggle.check(); // Set to checked
toggle.uncheck(); // Set to unchecked
toggle.toggle(); // Toggle state
toggle.isChecked(); // Get current state
toggle.disable(); // Disable toggle
toggle.enable(); // Enable toggle
// Event Listeners
toggle.addEventListener('change', e => {
console.log('State:', e.detail.checked);
});
</script>
checked
- Initial statedisabled
- Disable togglesize
- small|medium|largecolor-on
- Color when activecolor-off
- Color when inactivequantum-mode
- Enable quantum effectssuperposition-enabled
- Superposition effectparticle-count
- Number of particlestransition-speed
- Animation speedglow-intensity
- Effect intensitylabel
- Toggle label