🎨 Menu Component Demos

Interactive Navigation Prototypes

Note: These are prototype menu components extracted from CodePen demos. The original HTML files were Cloudflare-blocked, but the JavaScript and CSS are preserved here.

a1_menu - Primary Menu System

This demo showcases the primary menu navigation system. Click the button below to activate the menu interface.

🍔 Hamburger Central Menu

NEW! An animated hamburger menu with central circle design. Click the center button to expand 8 menu items in a radial pattern. Perfect for central navigation with smooth animations and hover effects.

View Hamburger Menu →

🔄 Circular Links Menu

NEW! A dynamic circular menu with continuously rotating links around a central hub. Features auto-rotation, smooth transitions, and eye-catching animations. Ideal for creating engaging, modern navigation experiences.

View Circular Menu →

📁 Available Components

The following menu components are included in this collection:

hamburger-central-menu.html - Animated hamburger with radial expansion
circular-links-menu.html - Rotating circular links navigation
a1_menu.js - Primary menu system implementation
a1_menu.css - Styling for menu components

🔗 Integration

These components are designed to integrate with:

Dashboard - React/TypeScript dashboard system
iMenu - 4-zoom-level ring menu (production)
4D Visualization - Hypercube navigation (planned)
Mindmap Frameworks - Knowledge visualization

🛠️ Development

To use these components in your own projects:

<link rel="stylesheet" href="a1_menu.css">
<script src="a1_menu.js"></script>

<script>
    // Initialize menu
    // Add your menu initialization code here
</script>