Collection
Post cover

Best 18 jQuery Notifications

Collection of free jQuery notification and alert code examples (boxes, badges, etc.) from codepen and other resources. Cookie policy notifications, alert badges with animations and more.

Evil Cookie Policy

Author: Álex

Links: demo and code

Made with: HTML / CSS / JS

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

Responsive: yes

Dependencies: gsap.js

Post cover

Profile and Notification Dropdowns

Profile and Notification Dropdowns using HTML CSS and Jquery

Dependencies: font-awesome.js

Author: Coding Market

Links: GitHub

Made with: HTML (65.1%), CSS (34.9%)

GitHub Activity:

⭐ Stars 👀️ Watchers 📎️ Forks
5 1 7

Alert Components

Author: Lucas Oliveira

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

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

Dependencies: font-awesome.css, jquery.js

Notification

Author: Souleste

Links: demo and code

Made with: HTML / CSS / JS

Animated Material notification in jQuery.

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

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

Notification Badge Animation

Author: Valery Alikin

Links: demo and code, dribbble shot

Made with: HTML / CSS (SCSS) / JS

Notification badge exploration.

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

Dependencies: jquery.js, anime.js

Notification Bell User-Interactions

Author: Himalaya Singh

Links: demo and code

Made with: HTML / CSS / JS

Experimenting with CSS animations, built a design of notification bell button.

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

Dependencies: jquery.js

Bell Notification Animation

Author: Diogo Gomes

Links: demo and code, dribbble shot

Made with: HTML / CSS (SCSS) / JS

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

Dependencies: jquery.js

Pop Up Notification

Author: David

Links: demo and code

Made with: HTML (Pug) / CSS (Sass) / JS (Babel)

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

Responsive: yes

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

Toast Messages + Remove Animation

Author: Veronica

Links: demo and code

Made with: HTML / CSS / JS

Toast messages UI components with jQuery remove animation.

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

Responsive: yes

Dependencies: jquery.js

Notification Animation

Author: Halil İbrahim Nuroğlu

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

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

Dependencies: materialdesignicons.css, jquery.js

Notifications Component

Author: Damián Muti

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

This is a Sass mixin that provides notifications functionality using little-to-none JavaScript. It makes use of CSS transitions and animations to display notifications as popups or bars on different locations of the viewport. The best thing is that it is fully customizable and easy to use.

Compatible browsers: Chrome, Firefox, Opera, Safari

Responsive: yes

Dependencies: jquery.js

Notifications, Alerts, Modals

Author: DevTips

Links: demo and code

Made with: HTML (Pug) / CSS (Sass) / JS

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

Dependencies: jquery.js

Overhang.js

Author: Paul. K; June 24, 2015

Links: github page, home page

A jQuery plugin for notifications, prompts and confirmations.

Notifications

Author: Hampus Persson

Links: demo and code

Made with: HTML / CSS (SCSS) / JS

Growl style notifications in jQuery.

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

Dependencies: jquery.js

NotifyJS

Notify.js - is a jQuery simple, versatile notification library to provide simple yet fully customisable notifications.

Author: jpillora (Jaime Pillora)

Links: GitHub, Website

GitHub Activity:

⭐ Stars 👀️ Watchers 📎️ Forks
1.9k 72 750

OhSnap!.js

A simple jQuery/Zepto notification library designed to be used in mobile apps

Author: justindomingue (Justin Domingue)

Responsive: yes

Links: GitHub, Website

Made with: JavaScript (100.0%)

GitHub Activity:

⭐ Stars 👀️ Watchers 📎️ Forks
280 14 66

Notify Better

An all in one jQuery plugin that let you change your favicon, browser's title and more to reflect new notifications

Author: peachananr (Pete R.)

Links: GitHub, Website

Made with: JavaScript (100.0%)

GitHub Activity:

⭐ Stars 👀️ Watchers 📎️ Forks
377 16 75

Toastr

Toastr is a Simple JavaScript library for non-blocking notifications. jQuery is required. The goal is to create a simple core library that can be customized and extended.

Author: CodeSeven

Links: GitHub, Website

Made with: JavaScript (66.8%), CSS (24.5%), HTML (8.7%)

GitHub Activity:

⭐ Stars 👀️ Watchers 📎️ Forks
11.3k 349 2k

Did you like the post? Share it with your friends!

Follow us on social networks

Feedback