JavaScript – get window reference from element

element.ownerDocument.defaultView

jQuery – how to raise hide and show events

Using my simple monkey-patch plugin found here: http://upshots.org/javascript/jquery-monkey-patch-duck-punch-manager, this is pretty simple… $.monkeyPatch({ hide : function(){ this.trigger(‘hidden’); }, show : function(){ this.trigger(‘shown’); } }); That’s it – now you can listen for “hidden” and “shown” events normally… $(selector).on(‘hidden’, function(){ console.log(‘hidden’); }); Note that this only hooks into the $.fn.hide and $.fn.show methods – hiding an […]

jQuery – lazy load (or effect) when an element is scrolled into the viewport

1. Implement a test to determine if the element is within the viewport. This one works. 2. Find a throttle or debounce function. Here’s my take, and underscore’s. 3. Create a function that uses the method in #1 to test if the element is visible, then perform your action (load an image, animate, add more […]

JavaScript – how to remove array elements while in a loop

This is actually a bit more simple than it seems. The key points are: 1. Decrement the iteration count when you splice out an element 2. Remember to test .length during the loop’s conditional test (contrary to normal best-practice). // don’t save array.length to a variable like you might want to normally, // it needs […]

JavaScript – detect support for background-size: cover

Most of the other solutions worked generally, but gave false negatives (e.g., IE9 does support it, but most test would indicate it did not). Here’s what seems to work so far, for me: var cover = (function(){ var supported = (‘backgroundSize’ in document.documentElement.style); if(supported){ var temp = document.createElement(‘div’); temp.style.backgroundSize = ‘cover’; supported = temp.style.backgroundSize == […]

JavaScript – move head of array

Function to move the head of an array by x positions – elements are moved to the end of the array, with order preserved. Dirty: Array.prototype.slide = function(index){ var spliced = this.splice(index); this.splice.apply(this, [0, 0].concat(spliced)); return this; }; Verbose: function slideArray(array, index){ var spliced = array.splice(index); array.splice.apply(array, [0, 0].concat(spliced)); return array; }; Usage: var arr […]

Wrapping / Looping / Infinite Array Traversal

I’ll use JavaScript syntax and provide a JS fiddle POC, but this really applies to almost any language – at least any that use indexed arrays (all that I can think of). To get an index greater than length to “wrap” back from the beginning, use a simple modulus: if ( index >= length ) […]

JavaScript – remove comments

Simple JS parser to strip comments // this is a comment /* this * is a multiline * comment */ Usage is simple – create an instance and call .strip(string) to get back the de-commented string… var cs = new CommentStripper(); console.log( cs.strip(someString) ); It’s *intended* to be 100% effective – catching any valid comment, […]

jQuery – detach elements to work with them

jQuery encourages us to .detach() elements to work with them: http://learn.jquery.com/performance/detach-elements-before-work-with-them/ Here’s a little plugin to help do just that (relies on my .insertAt method found here)… $.fn.insertAt = function(elements, index) { var array = $.makeArray(this.children().clone(true)); array.splice(index, 0, elements); this.empty().append(array); return this; }; $.fn.work = function(callback /*, … rest */){ var params = Array.apply(null, arguments).slice(1); […]

jQuery – insert elements at index

In response to some solutions on the board that failed for various reasons: 1. Allows multiple elements to be inserted (no other version I found did this, usually because they worked by appending and using .last()) 2. Maintains events and data (solved by .clone(true) on .children()) 3. Works with 0-children containers (by using children.before()) 4. […]