Pure Web Components

CUSTOM WEB COMPONENTS WRITTEN IN PURE JAVASCRIPT.

THIS IS NOT A BEGINNER'S GUIDE ON HOW TO WRITE WEB COMPONENTS. THESE ELEMENTS WERE ACTUALLY WRITTEN TO BE IMPLEMENTED IN REAL LIFE SCENARIOS.

1. ROUND SLIDER INPUT

This example covers the following topics:

• Component life cycles
• Stateful component model
• Input component model
• Handling touch/pointer events
• Dynamic events delegation
• Memory leaks prevention
• Render optimization
• SVG graphics
• Mordern Javascript

Usage:

<script src="slider.js"></script>
...
<ui-touch-slider value="10" min="0" max="100" track:color="lightcoral" value:text="10%" />