Archive for 2013

    spoiler-alert : jQuery plugin to hide spoilers on your site

    spoiler-alert : jQuery plugin to hide spoilers on your site

    Don’t spoil it! Hide copy and images with a bit of SVG blur. Taste on mouseover. Eat on click.

    Do you publish spoilers? Do you wish you could have them on your page in a way that wasn’t fucking rude? With Spoiler Alert! you can! Hide spoilers with a bit of blur.

    navIgo : Multipurpose jQuery Responsive Navigation Plugin

    navIgo : Multipurpose jQuery Responsive Navigation Plugin

    One can truly say this is really the ultimate navigation tool.With 65 jQuery plugin parameters there are thousands of customization options… literally!
    All menus on this page are initialized with the same jQuery plugin settings, all the differences you see between the menus are managed through data-attributes.

    Features:

    • Cross Browser Support (IE9 – Firefox – Chrome – Opera – Safari) + browser fallback message for IE9 below cases
    • 65 plugin parameters: you can control almost anything, and easy!
    • Horizontal or vertical orientation
    • Support for fullwidth dropdowns: any complex layout allowed, text blocks, video, tables, typograpy pictures
    • Easy skin control: set button colors, mouseover colors, text, shadows, alpha transparence directly with plugin parameters
    • Super granular Google font support: you can set font type and size for Main buttons, sub buttons /titles, subtitles and text
    • Auto active-button state: based on url address but it works even for # links (useful for ajax loaded pages)
    • 25 predefined colors: ready to use color classes inspired from metro colors
    • Programmable responsive behavior: you can set the limit screen resolution for responsive mediaquery activation.

    jQuery Autosave.js : Autosave input values to an ajax endpoint

    jQuery Autosave.js : Autosave input values to an ajax endpoint

    jquery.autosave.js is a little plugin that can help auto-save input values to an ajax endpoint on your site so that user-input is constantly sync’d with the backend database without full-page post backs.

    threesixty : jQuery plugin for creating draggable 360s Image sequences

    threesixty : jQuery plugin for creating draggable 360s Image sequences

    A jQuery plugin for generating a draggable 360 preview from an image sequence.

    HexaFlip: A Flexible 3D Cube Plugin with CSS3 & JavaScript

    HexaFlip: A Flexible 3D Cube Plugin with CSS3 & JavaScript

    HexaFlip is a JavaScript UI plugin that let’s you use 3D cubes as interface elements. Dive into the process of creating the plugin and learn some best practices regarding flexible UI plugins.

    I originally developed a simpler version of HexaFlip for an iPhone app I built called ChainCal where it served as a time-picker interface for setting alarms. Most mobile time-picker widgets are fashioned after a dial, but I reasoned that rotating cubes would serve for a more unique and memorable experience. As we all know, a cube has six (i.e. “hexa”) faces, but when rotating it around a single axis, we only have four to work with (front, top, back, and bottom). Thus if we built a cube interface using CSS alone, our interface would be limited to four options per choice. HexaFlip solves this issue and playfully challenges the user’s expectations by allowing the cube to cycle over a list of any length.

    Showbiz Pro Responsive Teaser jQuery Plugin

    Showbiz Pro Responsive Teaser jQuery Plugin

    Showbiz Pro is a highly customizable plugin to show you or your customer’s services, portfolio items, blog contents… basically all business information thinkable.

    What makes this item unique is that you can define everything(Captions, Preview, Details etc.) via CSS or HTML or jQuery plugin option which gives you Unlimited Layout Possibilites. Please check out the examples to see for example how a small preview view expands to a rich detailed panoramic view. All fits nicely in the designated area.

    Features:

    • Fully Responsive & Mobile Optimized (Smartphones & Tablets)
    • Drag & Scroll Function
    • Smart Loading of Embeded Videos (YouTube and Vimeo)
    • Retina Ready Icons via Font Face Icons
    • Unlimited Slides
    • iPhone & Android Swipe Touch enabled
    • FullWidth and Single Width Reveals
    • Fast CSS3 & jQuery Engine
    • Fancybox 2 Lightbox Plugin on Multi Domain License included ($89 Value)

    Behave.js : Add IDE style behaviors to plain text areas

    Behave.js : Add IDE style behaviors to plain text areas

    Behave.js is a lightweight library for adding IDE style behaviors to plain text areas, making it much more enjoyable to write code in.

    Features:

    • Supports Partial IE6, IE7+, Firefox 8+, Safari 4+, Chrome X+, Opera 12
    • No Dependencies
    • Custom Code/Behavior Fencing
    • Hard and Soft Tabs
    • Auto Open/Close Parenthesis, Brackets, Braces, Double and Single Quotes
    • Auto delete a paired character
    • Overwrite a paired character
    • Multi-line Indentation/Unindentation
    • Automatic Indentation

    Custom CSS3 Video Players With HTML5 and jQuery

    Custom CSS3 Video Players With HTML5 and jQuery

    In today’s multimedia web it’s becoming an ever increasing part of web design to include videos. Customizing the video player is one of the first things web designers think about when implementing these elements, as often the default player does not match the website, or merely for consistency across browsers and devices. In this tutorial we’re going to be going through exactly how to do that.

    jKit : jQuery based UI Toolkit

    jKit : jQuery based UI Toolkit

    A very easy to use, cross platform, jQuery based UI toolkit, that’s still small in size, has the features you need, and doesn’t get in your way of doing things!

    perfect-scrollbar : Tiny but perfect jQuery Scrollbar plugin

    perfect-scrollbar : Tiny but perfect jQuery Scrollbar plugin

    Tiny but perfect jQuery scrollbar plugin.

    Features:

    • There should be no css change on any original element.
    • The scrollbar should not affect the original design layout.
    • The design of the scrollbar should be (nearly) fully customizable.
    • If the size of the container or the content changes, the scrollbar size and position should be able to change.