Are you looking for Facebook UI features, this post will explain you how to create a Facebook style notifications popup using Jquery, HTML and CSS, you will understand how CSS elements will helps to improve better web design. This is the most needed feature for social networking web projects to minimize and enrich the UX elements.
Best jQuery CSS2 / CSS3.0 Plugins & Tutorials with Demo
Image Caption Animation with CSS3 Transitions & Transform
jQuery caption hover effects have been on the Web for a long time. There are plenty of jQuery libraries out there that can be used to obtain a cool and amazing image caption animation and hover effects.
That being said, it is now possible to do the same cool effects with CSS3 transitions and transform properties.
Tooltip Styles Inspiration with CSS3 & SVG
A small collection of various hover tooltip styles and effects for your inspiration. Using CSS transforms, border-radius and SVG shapes we can create modern looking and interesting tooltips.
Tooltips are normally used for providing some kind of extra information and they can be found in almost every website. Those tiny little helpers offer a great opportunity to add some subtle and unique effects to any design. So today we want to show you some possibilities of showing those elements in style. We only use CSS transitions via hover and also some SVGs to create unique shapes.
Revealing Content Overlays With CSS3 Transitions
In this tutorial, we create revealing content overlays with CSS3 transitions, allowing us to minimise content clutter and provide a neat user experience.
Imagine your company offered a bunch of different services, and on your website’s services section, they were listed. Each service had its own description, but you didn’t want to occupy a whole lot of page real estate. You present a bunch of attractive links or buttons instead, prompting and allowing users to click on the links to view more. Each service might not warrant a whole new page, so instead, we reveal content overlays with CSS3 transitions. They animate into view above the page, and can be closed off easily without ever having to traverse different pages.
scotchPanels.js : jQuery Off Canvas Menus and Panels Plugin
scotchPanels.js is a jQuery plugin for easily creating off canvas menus, navigations, and other panel types such as images, videos, and iframes. Scotch Panels are featured-packed and have a ton of different options for every skill-level to tweak and implement into almost any project.
Features:
- Uses CSS3 with JavaScript Fallback
- Fully Responsive
- Custom transition styles
- Completely Customizable with tons of optional settings
- Lightweight, easy to use, and only one file
- Cross Browser Support
- Choose either custom HTML, images, iframes, or video panels
- Optionally use HTM5 Data Attributes
- Off Canvas directions from top, Bottom, left, and right
- Works from any container or div
- Extensive Callbacks API
- Click, touch, hover, and keyboard helpers
- CSS Class Helpers
Azexo : jQuery drag and drop HTML builder with Bootstrap
jQuery drag and drop HTML builder – compile Bootstrap based HTML and JS. Builder extract required JS code (about 0% – 15%) from itself and provide it with resulting HTML to allow initialization a third party JS libraries on frontend. Generated HTML contain “data” attributes which store JS libraries settings and helpers to allow parse document structure by editor.
