Beautify Native Select Elements With JavaScript – nativejs-select

Category: Form , Javascript | November 11, 2018
Author: FrontendMetis
Views Total: 994
Official Page: Go to website
Last Update: November 11, 2018
License: MIT

Preview:

Beautify Native Select Elements With JavaScript – nativejs-select

Description:

nativejs-select is a vanilla JavaScript plugin to beautify the native select boxes with custom styles.

How to use it:

Import the nativejs-select’s JavaScript and CSS files into the html document.

<link rel="stylesheet" href="nativejs-select.css">
<script src="nativejs-select.min.js"></script>

That’s it. The plugin will automatically apply custom CSS styles to the matched select elements within the document. You’re able to customize the placeholder using the ‘data-placeholder’ attribute as this:

<select name="month" data-placeholder="Select month:">
  <option value="1">July</option>
  <option value="2">March</option>
  <option value="3">August</option>
</select>

To make the placeholder fixed:

<select name="month" data-fixed-placeholder="Month:">
  <option value="1">September</option>
  <option value="2">June</option>
</select>

Changelog:

11/11/2018

  • JS Update

You Might Be Interested In:


Leave a Reply