This post demonstrates different ways to add interactive JavaScript elements to your blog posts.

Example 1: Inline JavaScript (Simple Counter)

Click Counter

Clicks: 0

Example 2: Interactive Color Picker

Color Picker Demo

Selected color: #3498db

Example 3: Interactive Algorithm Visualization

Array Sort Visualizer

Example 4: Slider Interactive Element

Interactive Slider

Adjust the value: 50

Styling

How It Works

These interactive elements are created using:

• HTML for structure
• CSS for styling
• JavaScript for interactivity

You can add these directly in your markdown files, and Jekyll will include them in the generated HTML!