/web-components

Web Components examples written in pure Javascript

Primary LanguageJavaScript

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%" />