Skip to content

Instantly share code, notes, and snippets.


Steven Black StevenBlack

View GitHub Profile
StevenBlack / filledIn.js
Created Jan 31, 2010
View filledIn.js
jQuery custom selector that filters for input elements that have values, are checked, or are selected.
// Count the number of input items that are filled-in
( function( $ ){
// custom selector determines if an element is filled-in, checked, or selected.
$.expr[":"].filledIn = function( a ){
StevenBlack / jquery.headersAboveBelow.js
Created Mar 15, 2010
:headerBelow and :headerAbove
View jquery.headersAboveBelow.js
// jQuery custom selectors for headers above (lower <h> tag) or below (higher <h> tag) given an arbitrary level
(function( $ ) {
// selects all the headers below the passed index. So 2 matches <h3>, <h4>, <h5>.
headerBelow: function( elem, i, match ) {
if ( /h\d/i.test( elem.nodeName ) ) {
var level= parseInt( match[ 3 ], 10 ) + 1, str = "h["+ level +"-5]", re = new RegExp( str, "i" ), ret ;
return re.test( elem.nodeName );
return false;
View jQuery-UI page template
<!DOCTYPE html>
<html lang="en">
<link type="text/css" href="" rel="stylesheet" />
body{ font: 75% "Trebuchet MS", sans-serif; margin: 50px;}
View jQuery page template
<!DOCTYPE html>
<html lang="en">
<script src="" type="text/javascript"></script>
View jquery.pluginOutline.js
// Skeleton jQuery plugin
$.fn.myPlugin = function( options )
// options.
$.fn.myPlugin.settings = $.extend( {}, $.fn.myPlugin.defaults, options );
// Go through the matched elements and return the jQuery object.
StevenBlack / roundCorner.js
Created Apr 9, 2010
Round corners plugin
View roundCorner.js
Rounded-corners plugin.
$(function() {
View jquery.specialEvents.Example.js
// Special events
// Special event definition.
$ = {
setup: function() {
// This is only done the first time a "click" event handler is bound,
// per-element.
$(this).css( 'cursor', 'pointer' );
View jquery.between.js
// Source:
$.expr[':'].between = function(
var args = arrProperties[3].split(",");
var startSelector = args[0];
StevenBlack / jquery-tmpl comment by BorisMoore
Created Jun 29, 2010
jquery-tmpl comments by BorisMoore
View jquery-tmpl comment by BorisMoore
A template context corresponds to an instance of a rendered template, in the HTML DOM. It has fields:
'data' - the data item that was rendered using the template,
'tmpl' - the template that was used, 'nodes' - the HTML elements that were created and were inserted into the DOM,
'parent' - the parent template context, in the case of nested templates, e.g. using the {{tmpl }} tag.
tmplcmd provides the following commands:
'update' - re-render the template. The data, tmpl, or expandos on the template context, may have been modified, so the resulting HTML may be different than the previously rendered HTML. - Use update(ctx) to update (i.e. refresh/render the HTML in the DOM) a template context 'ctx' - or update(dataItem, contexts) to find the template context within an array 'contexts' that corresponds to that dataItem, and update that one. - You can also pass an array of contexts or data items as first parameter, and update them all at once.
'remove' - removes the rendered elements from the DOM. - Use remov
StevenBlack / scrollbarWidth.js
Created Sep 27, 2010
Calculate scrollbar width
View scrollbarWidth.js
// from
function scrollbarWidth() {
var div = $('<div style="width:50px;height:50px;overflow:hidden;position:absolute;top:-200px;left:-200px;"><div style="height:100px;"></div>');
// Append our div, do our calculation and then remove it
var w1 = $('div', div).innerWidth();
div.css('overflow-y', 'scroll');
var w2 = $('div', div).innerWidth();
return (w1 - w2);