Created
March 11, 2013 16:56
-
-
Save msrafi/5135669 to your computer and use it in GitHub Desktop.
Jquery: snippets
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//JS Snippets | |
// Gets the browser prefix | |
var browserPrefix; | |
navigator.sayswho= (function(){ | |
var N = navigator.appName, ua = navigator.userAgent, tem; | |
var M = ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i); | |
if(M && (tem = ua.match(/version\/([\.\d]+)/i))!= null) M[2] = tem[1]; | |
M = M? [M[1], M[2]]: [N, navigator.appVersion,'-?']; | |
M = M[0]; | |
if(M == "Chrome") { browserPrefix = "webkit"; } | |
if(M == "Firefox") { browserPrefix = "moz"; } | |
if(M == "Safari") { browserPrefix = "webkit"; } | |
if(M == "MSIE") { browserPrefix = "ms"; } | |
})(); | |
// Mouseover touch | |
function initNav(){ | |
// make drop-downs work properly with touchscreens by preventing instant hover-click | |
$( some_selector_for_your_top_level_list_items ).each(function(){ | |
var li = $(this); | |
li.mouseover(function(){ | |
// store time of hover event | |
li.data( 'hoverTime', new Date().getTime() ); | |
}); | |
li.children('a').click(function(){ | |
// only allow click if at least 50ms has elapsed since hover | |
return ( new Date().getTime() - li.data('hoverTime') ) > 50; | |
}); | |
}); | |
} | |
//Callbacks for Transitions | |
$(function(){ | |
$("#red_box").on('transitionend webkitTransitionEnd', function(e){ | |
/* Rather than log on screen, we'll alert the information */ | |
alert(e.originalEvent.propertyName); | |
alert(e.originalEvent.elapsedTime + 's'); | |
}); | |
}); | |
//Callbacks for Animations | |
$(function(){ | |
$("#blue_box").on('animationstart webkitanimationStart', function(e){ | |
alert(e.originalEvent.animationName); | |
alert(e.originalEvent.elapsedTime + 's'); | |
}); | |
$("#blue_box").on('animationend webkitanimationEnd', function(e){ | |
alert(e.originalEvent.animationName); | |
alert(e.originalEvent.elapsedTime + 's'); | |
}); | |
$("#blue_box").on('animationiteration webkitanimationIteration', function(e){ | |
alert(e.originalEvent.animationName); | |
alert(e.originalEvent.elapsedTime + 's'); | |
}); | |
}); | |
// Jquery Slider COntrol | |
$( "#ratingSlider" ).slider({ | |
range: "min", | |
value: 3, | |
min: 1, | |
max: 5, | |
//this gets a live reading of the value and prints it on the page | |
slide: function( event, ui ) { | |
$( "#ratingResult" ).text( ui.value ); | |
}, | |
//this updates the value of your hidden field when user stops dragging | |
change: function(event, ui) { | |
$('#rateToPost').attr('value', ui.value); | |
}}); | |
//Full page scroll - http://jsfiddle.net/vaibviad/JqU2T/8/embedded/result/ | |
$(document.body).on('DOMMouseScroll mousewheel', function (e) { | |
if (e.originalEvent.detail > 0 || e.originalEvent.wheelDelta < 0) { | |
dir = 'down'; | |
} else { | |
dir = 'up'; | |
} | |
// find currently visible div : | |
div = -1; | |
divs.each(function(i){ | |
if (div<0 && ($(this).offset().top >= $(window).scrollTop())) { | |
div = i; | |
} | |
}); | |
if (dir == 'up' && div > 0) { | |
div--; | |
} | |
if (dir == 'down' && div < divs.length) { | |
div++; | |
} | |
//console.log(div, dir, divs.length); | |
$('html,body').stop().animate({ | |
scrollTop: divs.eq(div).offset().top | |
}, 200); | |
return false; | |
}); | |
//Full page scroll | |
https://github.com/alvarotrigo/fullPage.js | |
// jQuery function to find index of clicked item | |
$.fn.getIndex = function(){ | |
var $sf = $(this), $p = $sf.parent().children();return $p.index($sf); | |
}; | |
//is the element at bottom? | |
$(window).scroll(function () { | |
if ($(window).scrollTop() == ( $(document).height() - $(window).height())) { | |
console.log("working"); | |
} | |
}); | |
//Is Element on screen? | |
$.fn.isOnScreen = function(){¡ | |
var win = $(window), | |
bounds = this.next().offset(), | |
viewport = { | |
top : win.scrollTop(), | |
left : win.scrollLeft() | |
}; | |
viewport.right = viewport.left + win.width(); | |
viewport.bottom = viewport.top + win.height(); | |
bounds.right = bounds.left + this.outerWidth(); | |
bounds.top = bounds.top + this.outerHeight(true)+50; | |
bounds.bottom = bounds.top - this.outerHeight(true); | |
return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom)); | |
}; | |
//polyfill for object.create | |
if(typeof Object.create !== 'function'){ | |
Object.create = function (obj){function F(){}; F.prototype = obj; return new F();}; | |
}; | |
// If we reached the end of window | |
$(window).bind('scroll', function() { | |
if (document.body.scrollHeight - $(this).scrollTop() <= $(this).height()) { | |
} | |
}); | |
// Fix floating content | |
var TIAA = TIAA || {}; | |
(function(){ | |
function Fixit(obj){ | |
this.obj = obj; | |
this.pos = this.obj.data('position') || 0; | |
this.fixClass = this.obj.data('fixClass') || 'fixed'; | |
}; | |
Fixit.prototype = { | |
constructor: Fixit, | |
init: function(){var sf = this; | |
sf.getPosition(); | |
$(document).on('scroll', function(){ | |
sf.getPosition.call(sf); | |
}); | |
}, | |
getPosition: function(){var sf = this; | |
sf.scrollPos = $(document).scrollTop()+sf.pos; | |
if(sf.obj.is(':visible') && !sf.obj.hasClass('vis')){ | |
sf.obj.addClass('vis'); | |
sf.posTop = Math.ceil(sf.obj.offset().top); | |
}; | |
(sf.posTop <= sf.scrollPos) ? sf.addClass.call(sf) : sf.removeClass.call(sf); | |
}, | |
addClass: function(){var sf = this; | |
sf.obj.addClass(sf.fixClass).css('top', sf.pos); | |
}, | |
removeClass: function(){var sf = this; | |
sf.obj.removeClass(sf.fixClass).removeAttr('style'); | |
} | |
}; | |
return TIAA.Fixit = Fixit; | |
})(); | |
$.fn.fixit = function(){ | |
this.each(function(){ | |
var fixit = new TIAA.Fixit($(this)); | |
fixit.init(); | |
}); | |
}; | |
// For prototype | |
$(document).bind('dc-after-load', function() { | |
$('div.fixIt, section.fixIt').fixit(); | |
}); | |
// For Dev team | |
// $(window).load(function() { | |
// $('div.fixIt, section.fixIt').fixit(); | |
// }); | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment