Skip to content

Instantly share code, notes, and snippets.

@msrafi
Created March 11, 2013 16:56
Show Gist options
  • Save msrafi/5135669 to your computer and use it in GitHub Desktop.
Save msrafi/5135669 to your computer and use it in GitHub Desktop.
Jquery: snippets
//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