Hand-picked free jQuery Toggle Switches. All the collections are Included with the demos and source codes.
About the Code
Gender Toggle Button
Gender( Male / Female ) toggle button for data input form.
More info: Link
Dependency: CSS – google fonts(family: Roboto:900), ionicons.min.css JS – jquery.min.js
About the Code
SVG / CSS animation – checkbox
Having fun with some SVG animations path
More info: Link
Dependency: jquery.min.js
About the Code
Draggable Skeuomorph Switch – Toggle
More info: Link
Dependency: jquery.min.js, anime.min.js
About the Code
Elastic Volume Toggle #2
More info: Link
Dependency: jquery-3.4.1.min.js, TimelineMax.min.js, TweenMax.min.js
About the Code
Overview – DevExtreme jQuery Switch
More info: Link
Dependency: CSS – dx.spa.css, dx.common.css, dx.light.css JS – jquery-3.1.0.min.js, dx.all.js
About the Code
Switch
CSS/jQuery switch element style and animation
More info: Link
Dependency: jquery.min.js
About the Code
3D Switch animation
More info: Link
Dependency: Fonts, JS – jquery-3.4.1.min.js, three.min.js, TweenMax.min.js
About the Code
Google Switch Collection
A collection of Google’s switch.
More info: Link
Dependency: jquery.min.js
About the Code
Custom Switch (Pure CSS)
Okey, okey, there is some jQuery but just for repetation, i mean for sustainability and body background. You can give up body background and delete jQuery, put the html that I append with jQuery manually and voila, there you go pure CSS.
More info: Link
Dependency: jquery.min.js
About the Code
Switch
Turn ‘check’ down for what Oo Create new elements for naveg… full future
More info: Link
Dependency: jquery.min.js
About the Code
Single-element Toggle Switch
Just another toggle switch.
More info: Link
Dependency: jquery.min.js
About the Code
Jquery Toggle Button
iOS style toggle switch button using jquery and css
More info: Link
Dependency: jquery.min.js
About the Code
Jquery Toggle Switch
A simple jquery plugin making use of object oriented design and prototypal inheritance rather than the old, bung a load of functions into a jquery callback plugin style.
Secondly, by using rgba, this button is reusable in a variety of contexts without any modification to the CSS. try changing the body background and you’ll see what I mean! : >
More info: Link
Dependency: CSS – jquery-ui.css , JS – jquery.min.js, jquery-ui.min.js
Discussion about this post