aetles + jquery   41

jQuery's Relevancy - There and Back Again -Telerik Developer Network
Because of the mounting you-don’t-need-jQuery sentiment as of late, I can’t help but think we have forgotten the basic value of jQuery. So I think it is time to remember.

In this article, I’m going to remind everyone what exactly jQuery is, because I believe that jQuery is as relevant today as it was when it was first written. The question relevancy should be tied to the original intent of the solution (i.e. the jQuery API itself) and not browser bugs or missing features. If we suggest otherwise, we run the risk of fueling a perspective that could be used to dismiss any abstraction that is not required, but none the less still powerful and helpful.

Before I get too far into defending jQuery’s relevancy, let’s first journey from the beginning again and back so that everyone is clear on the “what” and “why” of jQuery.
javascript  jquery  webdevelopment 
november 2015 by Aetles
snabbt.js is a minimalistic javascript animation library. It focuses on moving things around. It will translate, rotate, scale, skew and resize your elements. By including matrix multiplication operations, transforms can be combined in any way you want. The end result is then set via CSS3 transform matrices.

snabbt.js is built to be fast. It will only animate things that modern browsers can animate cheaply: transforms and opacity. The goal is to make a library that will let the user make smooth animations without needing to know too much about browser rendering.

Note: For convenience, width and height are animatable too, but beware since they may cause page reflows and slow down your animations.
css  javascript  jquery  js  animation 
january 2015 by Aetles
Velocity is a jQuery plugin that re-implements $.animate() to produce significantly greater performance (making Velocity also faster than CSS animation libraries) while including new features to improve animation workflow.
Velocity works everywhere — back to IE8 and Android 2.3. Under the hood, Velocity uses jQuery's $.queue(), and thus interoperates seamlessly with jQuery's $.animate(), $.fade(), and $.delay(). Since Velocity's syntax is identical to $.animate()'s, none of your code needs to change.
Download Velocity, add it to your page, and replace all instances of $.animate() with $.velocity(). You will immediately see a performance boost across all browsers and devices — especially on smartphones.
css  javascript  jquery  js  animation  webdevelopment 
may 2014 by Aetles
You Might Not Need jQuery
jQuery and its cousins are great, and by all means use them if it makes it easier to develop your application.

If you're developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you're only targeting more modern browsers, you might not need anything more than what the browser ships with.

At the very least, make sure you know what jQuery is doing for you, and what it's not. Some developers believe that jQuery is protecting us from a great demon of browser incompatibility when, in truth, post-IE8, browsers are pretty easy to deal with on their own.
development  javascript  jquery  js 
january 2014 by Aetles
A jQuery plugin that gives users real time hints & progress updates as they complete forms
forms  javascript  jquery  plugin 
august 2013 by Aetles
Magnific Popup: Responsive jQuery Lightbox Plugin
Magnific Popup is a free responsive jQuery lightbox plugin that is focused on performance and providing best experience for user with any device (Zepto.js compatible).
jquery  plugin  lightbox 
may 2013 by Aetles
Magnific Popup, A Truly Responsive Lightbox (For jQuery And Zepto.js) | Smashing Coding
A lightbox is one of those tools that work great on the desktop but often fail on small mobile devices. These days, finding a plugin that is responsive and that displays content right away is hard. For this reason, I created Magnific Popup, an open-source lightbox plugin focused on performance.
In this article, I’ll share the techniques I employed in creating this plugin, techniques that can make your lightbox much faster and easier to use, whatever the device being used.
javascript  jquery  lightbox 
may 2013 by Aetles
MixItUp - A CSS3 and JQuery Filter & Sort Plugin
What Is MixItUp?

MixItUp is a light-weight but powerful jQuery plugin that provides beautiful animated filtering and sorting of categorized and ordered content. It plays nice with your existing HTML and CSS, making it a great choice for fluid, responsive layouts. It's perfect for portfolios, galleries, blogs, or any categorized or ordered content!
jquery  css  filter  sort 
may 2013 by Aetles
Drupal – Use a different jQuery’s version for the frontend and backend | Blog
On Drupal frontend I want the latest jQuery specially because bootstrap require at least jQuery 1.7. How you know Drupal 7 come with the old jQuery 1.4 and it’s not going to be updated.

The module jQuery Update take care of updating jQuery to a newer version. I even use the dev version so I can have jQuery 1.8. Sadly this create some bug in the admin. To avoid conflict I decided to load a different jQuery version for the backend and the frontend.

To do that you have to create a very small module with this code:
drupal  jquery  jqueryupdate 
january 2013 by Aetles
jQuery plugin for Avgrund concept popin
Avgrund is a jQuery plugin for modal boxes and popups. It uses interesting concept showing depth between popup and page. It works in all modern browsers and gracefully degrade in those that do not support CSS transitions and transformations (e.g. in IE 6-9 has standard behavior). Tested with jQuery 1.4+, file size is under 2Kb, MIT Licensed.
javascript  jquery  js  ui 
september 2012 by Aetles
jQuery Mobile Icon Pack
The jQuery Mobile Icon Pack extends jQuery Mobile's default icon set with 173 crisp icons covering a wide range of categories including currency symbols, media control, social media, common application icons. You can preview either the original icon pack, or the brand new Font Awesome based icon pack using the buttons above. Download the icon pack using the button below.
jquery  jquerymobile  icons 
april 2012 by Aetles
jQuery Mobile Best Practices - a one year retrospective | Roughly Brilliant Digital Studios
jQuery Mobile is very easy to use. For anyone who knows jQuery, it's also very easy to manipulate. But with great power comes great responsibility. I've been working with JQM in a corporate and small business settings since it was in alpha 2 and these are some of the lessons I've learned. If you take these to heart, hopefully I can save you some of the same headaches.  Much of this is true about going mobile for anyone. jQuery Mobile was simply my chosen platform.  I stand by that choice.
jquery  jquerymobile 
march 2012 by Aetles
Chosen - a JavaScript plugin for jQuery and Prototype - makes select boxes better
Chosen is a JavaScript plugin that makes long, unwieldy select boxes much more user-friendly. It is currently available in both jQuery and Prototype flavors.
dropdown  forms  javascript  jquery 
february 2012 by Aetles
jmpress.js | a jQuery plugin to build a website on the infinite canvas
started as a jQuery port of
impress.jscreated by Bartek Szopka
but with a different goal in mind. Why keep it behind a podium? Let's make websites!
javascript  jquery  presentation 
february 2012 by Aetles
commadelimited/jQuery-Mobile-Bootstrap-Theme - GitHub
Twitter Bootstrap jQuery Mobile Theme
A jQuery Mobile theme based on Twitter Bootstrap.

The title says it all. I thought it would be a fun project to build out a jQuery Mobile theme emulating everyone's favorite hotness, the Twitter Bootstrap UI library. It's not a perfect translation of course, but consider it a work in progress.
jquery  twitterbootstrap  mobile 
february 2012 by Aetles
How to get Fixed Header and Footer Toolbars in jQuery Mobile 1.0
After extensively testing both of the primary scrolling options for jQuery Mobile I feel like the jQuery Mobile Scrollview is the best solution. It was very easy to install and configure, offered great support on iPhone and Android devices, and has more options and configurations available to customize your application. In addition, it may at some point be integrated into jQuery mobile as default functionality to serve as a bridge until position:fixed and overflow are full supported by the majority of active smartphones.
mobileweb  ios  jquery  smartphones  mobilesafari  android  layout  design 
november 2011 by Aetles
posabsolute/jQuery-Validation-Engine - GitHub
jQuery validation engine is a Javascript plugin aimed at the validation of form fields in the browser (IE 6-8, Chrome, Firefox, Safari, Opera 10). The plugin provides visually appealing prompts that grab user attention on the subject matter.

Validations range from email, phone, and URL, to more complex calls such as ajax processing or custom javascript functions. Bundled with many locales, the error prompts can be translated into the language of your choice.
javascript  jquery  plugin  validation 
november 2011 by Aetles
About Uploadify - Uploadify
Uploadify is a jQuery plugin that integrates a fully-customizable multiple file upload utility on your website.  It uses a mixture of Javascript, ActionScript, and any server-side language to dynamically create an instance over any DOM element on a page.

Uploadify was born out of the need for a multiple file upload utility for a CMS that was being developed.  After evaluating the other available options, RonnieSan decided the best option was to build a new plug-in and make it available to the development community.  In order to make the plug-in easy to implement and highly-customizable, the jQuery format was chosen.  After word got out, the popularity of the plug-in spawned the need for a dedicated site.  Travis Nickels volunteered his help to refine the Uploadify plug-in and make it what it is today.
flash  javascript  jquery  upload 
september 2011 by Aetles
jQuery File Upload Plugin With Drag ‘n’ Drop Support
jQuery File Upload is a plugin for the popular JavaScript framework that helps handling file uploads.

The plugin is based on open standards like HTML5-JavaScript and doesn't use Flash. For legacy browsers it falls back to an Ajaxed-like iframe-PHP solution.
jquery  upload 
september 2011 by Aetles
Upload to Amazon S3 with Uploadify | Flynsarmy
If you’ve ever wanted to allow people on your website to upload files to Amazon S3, you’ll know the only real way to do this is with flash – as it allows the client to upload directly instead of funneling all traffic through your server. You could write your own script for this, however there’s already a nifty little prebuilt tool I’m sure you’ve already heard of called Uploadify which can not only do the job for you, it can do so with great flexability.
imagehosting  amazons3  uploadify  jquery 
september 2011 by Aetles
FitVids.JS - A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
A lightweight, easy-to-use jQuery plugin for fluid width video embeds.
jquery  plugin  video 
september 2011 by Aetles
Tempo :: The tiny JSON rendering engine by TwigKit
Tempo is a tiny JSON rendering engine that enables you to craft data templates in pure HTML.

Why use Tempo?
Clear separation of concerns: no HTML in your JavaScript files
It makes AJAX content easier to work with
It's as friendly as a bunny rabbit (which are quite friendly)

Key Features
Works in Safari, Chrome, FireFox, Opera, and Internet Explorer 6+
Itty-bitty footprint, lightning-fast rendering!
No dependencies - Works with or without jQuery
Degrades gracefully if JavaScript is not enabled
Supports nested and conditional templates
html  javascript  jquery  json 
march 2011 by Aetles
Galleriffic | A jQuery plugin for rendering fast-performing photo galleries
A jQuery plugin for rendering rich, fast-performing photo galleries
Galleriffic is a jQuery plugin that provides a rich, post-back free experience optimized to handle high volumes of photos while conserving bandwidth. I am not so great at spelling, and it was much later that I realized that the more appropriate spellings would be Gallerific or Gallerrific, but is too late now for a name change, so Galleriffic remains.


Smart image preloading after the page is loaded
Thumbnail navigation (with pagination)
jQuery.history plugin integration to support bookmark-friendly URLs per-image
Slideshow (with optional auto-updating url bookmarks)
Keyboard navigation
Events that allow for adding your own custom transition effects
API for controlling the gallery with custom controls
Support for image captions
Flexible configuration
Graceful degradation when javascript is not available
Support for multiple galleries per page
javascript  gallery  jquery  plugin 
january 2011 by Aetles
OscarGodson/jQuery-Plugin-Skeleton - GitHub
Simple, it's just a skeleton of a jQuery plugin that you can download, clone, fork, whatever. I'm putting it on Github mainly for myself. It also includes an MIT license at the top of the skeleton.
jquery  javascript 
january 2011 by Aetles
Script Junkie | How to Debug Your jQuery Code
In this article, I’ll describe some techniques to assist you in the debugging process when you are using jQuery in client-side Web development. Thankfully, we have much better tools and technologies than developers had even five years ago.
jquery  development  debug  javascript 
january 2011 by Aetles
BigText Makes Text Big
It all began with a simple web foray to Designing Monsters. Their simple, typographic design was beautiful. But why? Their combination of the beautiful League Gothic font, use of Lettering.JS, and some simple font scaling gave the page a wonderful consistent vertical alignment. Like the Million Dollar Homepage, I wanted to rebuild it — but I didn’t want to spend a lot of time manually adjusting font sizes. So I did what any programmer with the jQuery Golden Hammer would do, I turned my problem into a nail.

At it’s simplest, the BigText jQuery plugin takes a single element and sizes the text inside of its child <div>s to fit the width of the parent element. Gives the text that lovely vertical alignment.
javascript  jquery  plugin  typography 
january 2011 by Aetles
Lightbox_me - Stupidly Simple Lightboxing
Have you ever had a DOM element that you wanted lightboxed, but didn't want all the fanciness of all the lightbox-related plug-ins out there? Lightbox_me is for you.

Lightbox_me is an essential tool for the jQuery developer's toolbox. Feed it a DOM element wrapped in a jQuery object and it will lightbox it for you, no muss no fuss.
javascript  jquery 
may 2010 by Aetles
Apple-Style Slider
SliderNav is a plugin that lets you add dynamic, sliding content using a vertical navigation bar (index). It's made mainly for alphabetical listings but can be used with anything, though longer words look a little awkward (see example 2).
may 2010 by Aetles
jScrollPane is a jquery plugin which allows you to replace the browsers default vertical scrollbars on any block level element with an overflow:auto style. You can easily control the apperance of the custom scrollbars using simple CSS.

jScrollPane is crossbrowser, working on all browsers that support jquery and it also degrades gracefully. If a user's browser doesn't support jQuery or has JavaScript turned off then they will see the browsers default scrollbars. If the mouse wheel plugin is included in the page then the scroll panes will respond to mouse wheel events as well.

jScrollPane is built on top of the awesome jQuery library and optionally utilises the mouse wheel plugin and the jQEm plugin
may 2010 by Aetles
Hacking at 0300 : Understanding jQuery UI widgets: A tutorial
This was written largely to help me make sense of using UI to create my own widgets, but I hope it may help others. "Widget" to me means a user-interface element, like a button or something more complicated like a popup date picker, but in jQuery UI terms it means a class, members of which are associated with HTML elements; things like Draggable and Sortable. In fact, not everything that I would have called a widget uses $.widget; the UI datepicker does not.
jquery  jqueryui 
march 2010 by Aetles
How to Create a Flash-like Color and Pattern Morphing effect with jQuery | Graphic and Web Design Blog
Today you will learn, how you can create a Flash-like effect with only using a few lines of jQuery and a transparent PNG as mask.

Not only will you be able to dynamically change the color of the logo, but also add patterns as you wish and even animate them later with a few lines of code. With this technique you will also be able to add transition effects and control any single part of the colors, patterns and animations.
march 2010 by Aetles
In the Woods – How to Integrate the jQuery Galleria and jCarousel Plugins
There are loads of great jQuery plugins, some more useful than others. The two I’ve recently used quite heavily are Galleria and jCarousel. Both well known for their flexibility and the ease of customization. But what if you’d like to make them work together to build an image gallery?
jquery  galleria  jcarousel 
march 2010 by Aetles
jQuery Slider plugin (Safari style) « Design it. Develop it. Use it.
jQuery Slider is easy to use and multifunctional jQuery plugin.
march 2010 by Aetles
David DeSandro: jQuery Masonry
Masonry is a layout plugin for jQuery. Think of it as the flip side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically then horizontally according to a grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.
jquery  css 
february 2010 by Aetles
gMap - Google Maps Plugin For jQuery | About
What is gMap?
gMap is a lightweight jQuery plugin that helps you embed Google Maps into your website. With only 2 KB in size it is very flexible and highly customizable.
jquery  googlemaps 
february 2010 by Aetles
How To Create A Sexy Vertical Sliding Panel Using jQuery And CSS3 | Spyre Studios
More and more we see people using horizontal sliding panels on their websites. And they usually look very nice! Some will put a contact or login form in there, others will put some information about them and their website, or even things like a tag cloud or social networking buttons.

Horizontal sliding panels are great for many situations, but like everything else, they’re not always ideal. It depends on the project. To see what I mean by ‘horizontal sliding panel‘, go have a look at my other site Design-Newz, and click on the ‘want more‘ button that’s on the right above the navigation bar.

The Plan
So, what about a vertical sliding panel that would act as some sort of drawer instead of the usual top horizontal sliding panel that pushes everything else down when it opens? While thinking of alternatives to the usual horizontal panels, I thought it would be nice to create something that works in a similar way, but that is a bit more flexible.
jquery  ccs3 
february 2010 by Aetles
How To Create A ‘Mootools Homepage’ Inspired Navigation Effect Using jQuery - Nettuts+
As you know there are a host of competing javascript libraries around these days. Though I prefer jQuery, I've always liked the way the menu on MooTools worked. So in this tutorial we'll recreate that same effect ... but we'll do it in jQuery!
javascript;  jquery 
november 2009 by Aetles
A List Apart: Articles: CSS Sprites2 - It’s JavaScript Time
A sense of movement is often the differentiator between Flash-heavy web sites and standards-based sites. Flash interfaces have always seemed more alive—responding to the user's interactions in a dynamic way that standards-based web sites haven't been able to replicate.

Lately that's been changing, of course, with a resurgence in dynamic interface effects, helped along by JavaScript libraries that make it easy—libraries such as Prototype, Scriptaculous, Moo, YUI, MochiKit (and I could go on). It's high time to revisit the CSS Sprites technique from four years ago, and see if we can't interject a little bit of movement of our own.

The examples below demonstrate inline CSS Sprites2, the technique we'll be covering in this article:

Home About Services Contact
Home About Services Contact
Home About Services Contact
Enter the jQuery
So here's the first caveat: we're going to lean on jQuery to make this happen. jQuery is a maturing JavaScript library that does the same neat stuff as all the other JavaScript libraries, and it has an additional advantage that lends itself particularly well to extending CSS Sprites: jQuery allows us to select elements on a page using a CSS-like syntax that we already know.
javascript  jquery 
november 2009 by Aetles
agile approach | Drupal 6 jQuery in Under 5 Minutes
Några enkla saker att tänka på när man ska använda jQuery i Drupal.
drupal  jquery 
may 2009 by Aetles

Copy this bookmark: