Dot Navigation Styles with CSS3 & SVG

Dot Navigation Styles with CSS3 & SVG

Small UI elements usually don’t get too much attention when it comes to creative effects. They are often neglected because of their size. But they can offer a great opportunity to add some subtle, yet interesting effects. Recently, you might have seen some kind of dot navigation with a vertical or horizontal layout for scrolling a website to a section. Today we want to share a set of inspirational dot navigation styles with very subtle effects when we hover or when we click on them. For the effects we employ several techniques, including transitions on pseudo-elements, perspective and SVG.

Selectonic : jQuery plugin for list of items selectable by mouse and keyboard

Selectonic : jQuery plugin for list of items selectable by mouse and keyboard

jQuery based plugin for making any list of items selectable by mouse and keyboard. It could be usefull in webapp where are different widgets like menus, dropdowns with keyboard input, lists with multiple selection and so on. It maybe too bold for just a simple menu in one place.

Features:

  • Single or multiple selection (uses CSS-classes);
  • Keyboard input like in classic filemanagers;
  • Possibility to set handle – elements for selecting items;
  • Auto-scrolling list’s element and window;
  • And other configurable stuff.

Simple 3D Coverflow

Simple 3D Coverflow

Simple 3D Coverflow is a fully responsive media 3D coverflow plugin that allows you to display media content with an unique original layout from a 3D perspective. It’s perfect for any kind of presentation, for anyone that wants to deliver a great impact on their visitors. It runs on all major browsers and mobile devices like iPhone, iPad, IOS, Android and Windows 8. Also supports unlimited categories and each category can have any number of thumbnails. The datalists are loaded from a simple HTML markup.

Time : jQuery Plugin to Display the Time since an event

Time : jQuery Plugin to Display the Time since an event

jQuery Plugin to allow you to display the time since an event. PHP formats the dates on the backend, then jQuery updates the times within the browser.

Rich_textarea : jQuery UI plugin replacement for a TEXTAREA

rich_textarea: jQuery UI plugin replacement for a TEXTAREA

Rich_TextArea is a jQuery plugin replacement for the venerable HTML TEXTAREA that adds arbitrary triggered autocompletes along with the insertion of rich “embedded objects” included images, links, or any other markup.

Rich_TextArea is not a WYSIWYG editor. It’s intended to be a replacement for a plain TEXTAREA with some additional features including:

  1. dropdown autocomplete support based on definable trigger characters such as @mentions, #tags, etc.
  2. insertion of arbitrary markup to represent “embedded objects”, such as images, links, etc. which are treated as single entities from the point of view of cursor movement and mouse selections.
  3. regular expression triggered callbacks enabling things like in-line URL rewriting, smiley insertion, etc.
  4. generation of a plain text representation of the editable area.

jQuery PopMenu Plugin

jQuery PopMenu Plugin

A simple responsive popup menu, it’s a jQuery plugin.

jQuery lazyload Any

jQuery lazyload Any

A jQuery plugin provides a lazyload function for everything.jQuery-lazyload-any currently supports IE7+, Chrome, Firefox, Safari and Opera.

jQuery Calculator Plugin

jQuery Calculator Plugin

This plugin attaches a popup calculator to an input field.

  • Simple or scientific calculators.
  • Define your own keys.
  • 15 localisations.

jqEasytooltip : jQuery Tooltip Plugin

jqEasytooltip : jQuery Tooltip Plugin

jqEasytooltip is an easy and customizable jquery plugin, built in css3 and well-designed javascript. Easy to use and customize, and strong for advanced users. Only one class to initialize (Declarative init) with data attributes. Modern css3 open and close effects.

This plugin features a lot of design themes, css3 transition effects, and more than 300 icons from font awesome included for buyers. All customization can be handled via jQuery Options, HTML 5 data-attributes and CSS!

Features:

  • 25 themes to choose and customizable
  • More than 300 icons ready to use
  • 10 pure CSS3 animations for appear and disapear
  • Customizable events to show, hide, mousemove, enable, disable, etc..
  • Declarative init, easy and fast
  • Follow mouse or fixed position
  • youtube, vimeo, googlemaps, etc… tooltip content
  • collision window system
  • And much more configurations!!

ScrollStory : jQuery UI widget for Scroll-based pages and Interactions

ScrollStory : jQuery UI widget for Scroll-based pages and Interactions

A jQuery UI widget for building simple, scroll-based pages and interactions.

Key features :

  • 100% style agnostic. Just a collection of often-used scroll-based patterns.
  • Can can you existing DOM or use an array of objects to create markup.
  • 16+ jQueryUI-style events/callbacks for various application state events.
  • Focus and blur event when an individual story becomes active or inactive.
  • Items can be grouped into categories, with event dispatched as categories change.
  • Items filterable by user-specified tags.
  • Items aware of their in-viewport status.
  • Programmatically animated scroll to any item.
  • Throttled scroll events and minimal DOM usage.

Examples :