Collection of free jQuery input type text code examples (placeholders, float labels, etc) from codepen and other resources. Update of December 2019 collection. 5 new items.

Related Articles

  1. CSS Input Text
  2. JavaScript Input Text
  3. React Input Text
  4. Vue Input Text

Author

  • cris_0xC0

About a code

TagsInput

This repository is a jQuery plugin for a tag input text.

Author

  • Israel Ferreira de Moraes

About a code

jQuery multiAutocomplete

A jQuery plugin that allows multiple autocompletes in a input.

Author

  • Álex

Made with

  • HTML / CSS / JS

About a code

Password Strength Meter

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: font-awesome.js, gsap.js

Author

  • SocialBu

About a code

jQuery Slasher

A plugin that allows you to build slash commands in your project.

Dependencies: caret.js

Author

  • Novelja Korac

About a code

Filter Table

Simple jQuery plugin for filtering table rows based on input (filter) value.

Dependencies: bulma.css

Author

  • Aaron Iker

Made with

  • HTML / CSS (SCSS) / JS

About a code

Input Text Interaction Animation

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js

Author

  • burnaDLX

Made with

  • HTML / CSS (Sass) / JS

About a code

Password Strength Validation

Password strength validation with visibility toggle in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: ionicons.css, jquery.js

Author

  • Benjamin Koehler

Made with

  • HTML / CSS / JS

About a code

Input Live Style Changer

This input can change his style via 3 buttons to serious, modern or cheeky with a nice style animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js,

Author

  • Godje

Made with

  • HTML (Pug) / CSS (Sass) / JS

About a code

Dot Digit Input

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Author

  • Chris Coyier

Made with

  • HTML / CSS / JS

About a code

jQuery Input Masks

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js, jquery.inputmask.js

Author

  • Andy Pagès

Made with

  • HTML / CSS (SCSS) / JS (Babel)

About a code

Fancy Animated Input Field

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: animate.css, jquery.js

Author

  • Ravi Dhiman

Made with

  • HTML (Haml) / CSS (SCSS) / JS

About a code

Tags

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: bootstrap.css, font-awesome.css, jquery.js

Author

  • Elior Tabeka

Made with

  • HTML (Slim) / CSS (SCSS) / JS (Babel)

About a code

Email Input Validation Behavior

Email input validation in jQuery.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Author

  • Charlyn G

Made with

  • HTML / CSS (SCSS) / JS

About a code

Input Text Field

Input text field label animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js

Author

  • Alexander Erlandsson

Made with

  • HTML / CSS (Less) / JS

About a code

Modern Style Input Text

Simple but yet modern look of input text fields.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js

Author

  • Caleb Sylvest

Made with

  • HTML / CSS / JS

About a code

Morphing Input Field Button

An email input field, styled to look like a button, that when clicked morphs into an email field.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Author

  • Max Huang

Made with

  • HTML / CSS / JS

About a code

Input Text Rendering

Pixel isometric input text rendering.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: jquery.js, obelisk.js, dat-gui.js