Jquery: snippets

Javascript-snippets.js

//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();
	// });