From 4b97a13a01e605f0888fe81cf1289032b65c0a1f Mon Sep 17 00:00:00 2001 From: vigiman Date: Thu, 31 Dec 2015 15:02:58 +0200 Subject: [PATCH 1/2] Create DesktopMobileComp This file will contain good methods for working in a desktop-mobile compatible environment --- dist/DesktopMobileComp | 74 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 74 insertions(+) create mode 100644 dist/DesktopMobileComp diff --git a/dist/DesktopMobileComp b/dist/DesktopMobileComp new file mode 100644 index 0000000..f3e794c --- /dev/null +++ b/dist/DesktopMobileComp @@ -0,0 +1,74 @@ + /*! + * This file will contain good methods for working in a desktop-mobile compatible environment + *brought as a contribution to Gal Rettig's publicJS library + *Feel free to add some yourself + * Shoham Vigiser + */ + + + var isDesktop = (function(){ + try { + document.createEvent("TouchEvent"); + } + catch(e){ + return true; + } + return false; + })(); + + + if( isDesktop ){ + //put here stricly desktop functions + //these are two JQuery based functions made for easily implentation to a single object or a class the ability to follow screen while scrolling + (function($) { + makeObjectFollowScrollById("yourid",20); + makeObjectFollowScrollByClass("yourclassname",20); +})(jQuery); + + } + + + // two paramaters: first is object name by class or id + // second is the space between element and top of screen (when scrolling) +function makeObjectFollowScrollById(String id, int DtopMargin){ +var element = $('#'+id), + originalY = element.offset().top; + + + var topMargin = DtopMargin; + + // Should probably be set in CSS; but here just for emphasis + element.css('position', 'relative'); + + $(window).on('scroll', function(event) { + var scrollTop = $(window).scrollTop(); + + element.stop(false, false).animate({ + top: scrollTop < originalY + ? 0 + : scrollTop - originalY + topMargin + }, 300); + }); +} + + +function (String class, int DtopMargin){ +var element = $('.'+class), + originalY = element.offset().top; + + + var topMargin = DtopMargin; + + // Should probably be set in CSS; but here just for emphasis + element.css('position', 'relative'); + + $(window).on('scroll', function(event) { + var scrollTop = $(window).scrollTop(); + + element.stop(false, false).animate({ + top: scrollTop < originalY + ? 0 + : scrollTop - originalY + topMargin + }, 300); + }); +} From 59e50655ed54d75f8ea4f1a87f1174556ab361e8 Mon Sep 17 00:00:00 2001 From: vigiman Date: Thu, 31 Dec 2015 15:30:50 +0200 Subject: [PATCH 2/2] Update DesktopMobileComp --- dist/DesktopMobileComp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/dist/DesktopMobileComp b/dist/DesktopMobileComp index f3e794c..1a4b99c 100644 --- a/dist/DesktopMobileComp +++ b/dist/DesktopMobileComp @@ -30,7 +30,7 @@ // two paramaters: first is object name by class or id // second is the space between element and top of screen (when scrolling) -function makeObjectFollowScrollById(String id, int DtopMargin){ +function makeObjectFollowScrollById(id,DtopMargin){ var element = $('#'+id), originalY = element.offset().top; @@ -52,7 +52,7 @@ var element = $('#'+id), } -function (String class, int DtopMargin){ +function (class,DtopMargin){ var element = $('.'+class), originalY = element.offset().top;