Get started with equalizer.js CDN

(MIT OR GPL-2.0) licensed

Equalizer.js is a lightweight library for handling equal height columns in responsive layouts.

Tags:
  • ui
  • equalizer
  • equal
  • height
  • width
  • layout

Stable version

Copied!

How to start using equalizer.js CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with equalizer.js CDN - cdnhub.io</title>
    <style>
        #visualizer {
            height: 200px;
            width: 100%;
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <div id="visualizer"></div>
    <script src="https://cdn.cdnhub.io/equalizer.js/1.01/equalizer.min.js"></script>
    <script>
        const audio = new Audio('path/to/your/audiofile.mp3');
        const equalizer = new Equalizer(audio, {
            size: 200,
            width: 1,
            height: 200,
            container: document.getElementById('visualizer'),
            gainNode: audio.gainNode,
            maxValue: 0.5,
            minValue: -0.5,
            colorMap: ['#000000', '#333333', '#666666', '#999999', '#CCCCCC', '#EEEEEE', '#FFFFFF'],
            onRenderFrequency: 20
        });

        audio.play();
    </script>
</body>
</html>
Copied!
Copied!

All versions