hakanersu / Amaranjs
Licence: mit
Nice, sleek and stylish notifications.
Stars: ✭ 214
Programming Languages
javascript
184084 projects - #8 most used programming language
coffeescript
4710 projects
Labels
Projects that are alternatives of or similar to Amaranjs
Stickyfloat
This plugin makes it possible to have a fixed position element that is relative to it’s parent. A normal fixed positioned element would be “out of context” and is very difficult to use in the most common situations with fluid designs. This plugin solves that problem with as little code as I could possible get it so it will run in the most optimized way, while also allow you to customize it in many important ways which might suit you best.
Stars: ✭ 166 (-22.43%)
Mutual labels: jquery-plugin, jquery
Jquery Aniview
A jQuery plugin that works in harmony with animate.css in order to enable animations only when content comes into view.
Stars: ✭ 205 (-4.21%)
Mutual labels: jquery-plugin, jquery
Sticky Sidebar
😎 Pure JavaScript tool for making smart and high performance sticky sidebar.
Stars: ✭ 2,057 (+861.21%)
Mutual labels: jquery-plugin, jquery
Rangeslider.js
🎚 HTML5 input range slider element polyfill
Stars: ✭ 2,153 (+906.07%)
Mutual labels: jquery-plugin, jquery
Balancedgallery
A balanced photo gallery plugin for jQuery.
Stars: ✭ 158 (-26.17%)
Mutual labels: jquery-plugin, jquery
Bootstrap Input Spinner
A Bootstrap 4 / jQuery plugin to create input spinner elements for number input
Stars: ✭ 176 (-17.76%)
Mutual labels: jquery-plugin, jquery
Jquery.resizeend
A custom event that fires when a user stops resizing their browser.
Stars: ✭ 155 (-27.57%)
Mutual labels: jquery-plugin, jquery
Jquery Contextmenu
jQuery contextMenu plugin & polyfill
Stars: ✭ 2,148 (+903.74%)
Mutual labels: jquery-plugin, jquery
Hc Offcanvas Nav
JavaScript library for creating toggled off-canvas multi-level navigations, allowing endless nesting of submenu elements, supporting swipe gestures, keyboard interactions and ARIA attributes.
Stars: ✭ 201 (-6.07%)
Mutual labels: jquery-plugin, jquery
Calx.js
jQuery Calx - a jQuery plugin for creating formula-based calculation form
Stars: ✭ 190 (-11.21%)
Mutual labels: jquery-plugin, jquery
Viewport.jquery
viewport.jquery - simple but handy jQuery plugin adding methods and CSS selectors to check if element is in certain viewport
Stars: ✭ 156 (-27.1%)
Mutual labels: jquery-plugin, jquery
Jquery Scrollstop
A jQuery plugin that fires events when scrolling stops and starts.
Stars: ✭ 158 (-26.17%)
Mutual labels: jquery-plugin, jquery
Normalmap.js
normalmap.js is a library for creating simple interactive lighting effects using normal maps.
Stars: ✭ 156 (-27.1%)
Mutual labels: jquery-plugin, jquery
Bdialog
Extend the Bootstrap Modal features, making dialog more functions and easier to use, dialog type including modal, alert, mask and toast types
Stars: ✭ 174 (-18.69%)
Mutual labels: jquery-plugin, jquery
Jquery Connections
Add stylable lines connecting page elements. ⮑ Handy for visualizing relations and graph edges. ⮐
Stars: ✭ 151 (-29.44%)
Mutual labels: jquery-plugin, jquery
Magnificent.js
🔍 Zoom responsively, images & more, w/ jQuery.
Stars: ✭ 153 (-28.5%)
Mutual labels: jquery-plugin, jquery
Tui.editor
🍞📝 Markdown WYSIWYG Editor. GFM Standard + Chart & UML Extensible.
Stars: ✭ 14,016 (+6449.53%)
Mutual labels: jquery-plugin, jquery
AmaranJS jQuery Notification Plugin
Nice, sleek and stylish notifications.
You can check AmaranJS v.1.0.1, with this version amaranjs no longer requires jquery and most of the animations moved to css animations.
What is new and What is changed
- Blur Theme ,Rounded Theme and Read More theme removed.
- All javascript codes ported to coffee and css to sass.
- Animate.css and options added for alternative css3 effects.
Some Features
Here is the some basic features of AmaranJS.But i recommend that review the examples and check demos.
- Easy notification creation.
- Unique notification animations.
- Included stylish themes.
- Easily adapt your own themes.
- Callbacks
Installation
Go to dist directory and copy all the folders to a new destination, which will be your project home.
It’s not required, but i recommend placing CSS files in <head> and JavaScript files and initialization code in the footer of your site (before the closing </body> tag).
jQuery required for Amaran JS.If you already have jquery.js on your site, don’t include it a second time, or use jQuery.noConflict(); mode
<link rel="stylesheet" href="/css/amaran.min.css">
You can add jQuery via Google CDN
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
Place Amaran JS after jQuery
<script src="/js/jquery.amaran.js"></script>
So minimalistic setup look like this
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<link rel="stylesheet" href="/css/amaran.min.css">
</head>
<body>
<p>My Content</p>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="/js/jquery.amaran.js"></script>
</body>
</html>
Optional Steps
- Awesome theme uses fontawesome if you want to use awesome theme you have to include fontawesome.
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
- If you want to use Animate.css effects you have to include Animate.css . Animate.css already included dist/css folder.
<link rel="stylesheet" href="/css/animate.min.css">
Usage
AmaranJS included 4 theme (for now).
Very basic usage ,not include any theme.
$(function(){
$.amaran({'message':'My first example!'});
});
If you want to use included themes , you have to pass content object with desired fields.
Awesome theme usage.
$.amaran({
content:{
title:'My first funcy example!',
message:'1.4 GB',
info:'my_birthday.mp4',
icon:'fa fa-download'
},
theme:'awesome ok'
});
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].