Pulse Effect
Grow-and-shrink scale animation perfect for notification indicators and status badges.

See Also

All JavaScript Effects Breathe Scribe Reveal Scramble Counter Ripple Shake Twinkle

Domma.effects.pulse()

Creates a grow-and-shrink breathing effect using scale transforms. Ideal for notification dots, badge counters, loading states, and interactive buttons.

// Basic usage
Domma.effects.pulse('.badge');

// With configuration
const pulse = Domma.effects.pulse('.element', {
  scale: 1.05,        // Scale factor (1.05 = 5% larger)
  duration: 2000,     // Animation cycle time in ms
  stagger: 100,       // Delay between multiple elements
  pauseOnHover: true  // Pause when hovering
});

// Control methods
pulse.pause();
pulse.resume();
pulse.stop();
pulse.destroy();

Demo: Basic Pulse

Simple pulsing animation on badge elements.

Badge 1 Badge 2 Badge 3
Domma.effects.pulse('#pulse-demo-1 .badge', {
  scale: 1.1,
  duration: 2000,
  stagger: 100
});

Demo: Scale Variations

Different scale factors for varying intensity.

Subtle (3%)
Medium (10%)
Bold (20%)
// Apply different scales to each item
$('#pulse-demo-2 .demo-item').each(function() {
  const scale = parseFloat($(this).attr('data-scale')) || 1.05;
  Domma.effects.pulse(this, {
    scale: scale,
    duration: 2000
  });
});

Demo: Notification Dot

A pulsing notification indicator.

Domma.effects.pulse('#notification-dot', {
  scale: 1.3,
  duration: 1500
});