Live search Anywhere with 'hideseek.js'
Embed a live search bar to search in any div container.
.png)
Email Validation (Non-free / Work)
Excluding 100 of the most popular free email domains from using it in a Webflow form with JavaScript.
.png)
Chart.js in Webflow
A short tutorial on how to implement a Chart.js plugin in a Webflow project
ToDo List
A todo list, created with JavaScript collected through the internet... ;)
.png)
Cursor Blend
A few short lines of code, to replace the pointer with an interactive color element.
Contact form as a Chat widget
A contact form disguised as a chat widget.
%2520(1).png)
Code Syntax in a Dynamic rich-text Element
Using highlight.js plugin to add code syntax in a Dynamic rich-text element
Variant Width for CMS items
Applying variant width to CMS items on the same list.
Math formulas in CMS
Writing inline (LaTeX) math formulas anywhere on a static or dynamic page using MathJax.
Auto change tabs
A script to automatically switch between tabs in a loop.
Pass Parameters
Pass input fields parameters and add them to the destination URL.
.png)
Hover to reveal Mask
A fixed background image that is revealed by mouse hover all over the section
.png)
Dynamically Inject current page URL to a Text element
Changing a text element by the page url using JavaScript
.png)
Tabs with scrollable (sideways) Menu
A Webflow Tabs widget with some edits and custom code to make the menu scrollable on desktop & mobile
.png)
Auto Change Tabs 2.0
A new and improved version for a Tabs element that automatically change tabs
.png)
Animated Favicon
A short code that changes multiple .png files to create animation.
OS Detection with JavaScript
Short JavaScript code that detects which OS system the user is running and display div accordingly.
"Highlight & Share" with Sharect.js (like in Medium)
A lightweight 'Select text and share / tweet'
.png)
Scroll & Focus
Scroll down and focus on an input field when a button is clicked
.png)
Current Class on Dropdown
Makes the dropdown element (usually inside navigations) indicate when a current state is active on one of the pages within.
.png)
Simple Mega Nav (Similar to Mailchimp's)
A very simple mega navigation bar, opens on hover and changes background color on scroll.
.png)
Auto get Current Year
Automatically insert the current year to any element with the class of 'year'
).png)
Scroll Menu to Current Link
Using JS to scroll a div (menu) to the current link inside.
).png)
Background Video with Audio (using plyr.js)
An embed video with Mute/UnMute button using plyr.js plugin.
).png)
Floating Labels Interaction
A short CSS code for floating labels on a form
.png)
Symbol in RichText
Insert a symbol element into a RichText. On a static or dynamic page.
.png)