Themeable Html Select Box Replacement – select.js

Category: Form , Javascript | January 12, 2016
Views Total:2,355 views
Official Page:Go to website
Last Update:January 12, 2016


Themeable Html Select Box Replacement – select.js


select.js is a javascript library for styling the standard HTML select elements with CSS and javascript.

3 built-in themes:

  • Default
  • Dark
  • Chosen

How to use it:

Choose and include a theme CSS in the header.

<link rel="stylesheet" href="css/select-theme-default.css" />

Create a standard html select box.

<select class="demo">
<option value="">Select a country...</option>
<option value="United States">United States</option>
<option value="United Kingdom">United Kingdom</option>

Include necessary javascript library files at the bottom of the page.

<script src=""></script>
<script src="select.js"></script>

Initialize the plugin with options.

new Select({
el: this


new Select({
el: this,
className: 'select-theme-dark', // or select-theme-chosen
useNative: false, // By default, select fallsback to opening the native browser select on touch devices which are less than or equal to 640px in either height or width.
alignToHighlighted: 'never' // Select has an option called alignToHighlighted which allows you to change whether the drop is positioned like a real select element (with the currently selected option over the element) or like a canonical dropdown menu.



  • Bugfix

You Might Be Interested In:

Leave a Reply