firstgarden/firstgarden-web-gnu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

모바일 플로팅 메뉴 스크립트 수정

Browse Source
This commit is contained in:
chicpro
2013-10-01 10:15:52 +09:00
parent f8e1e9eb9c
commit c44d1ffa73
1 changed files with 136 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

172
js/jquery.floatmenu.js
View File

@ -1,9 +1,11 @@
(function($) { (function($) {
$.fn.topFloatMenu = function(timeout, duration) $.fn.topFloatMenu = function(timeout, duration, interval, count)
{ {
var cfg = { var cfg = {
timeout: 300, timeout: 200,
duration: 300 duration: 300,
interval: 500,
count: 10
}; };
if(typeof timeout == "object") { if(typeof timeout == "object") {
@ -16,13 +18,23 @@
if(duration) { if(duration) {
cfg = $.extend({ duration: duration }); cfg = $.extend({ duration: duration });
} }
if(interval) {
cfg = $.extend({ interval: interval });
}
if(count) {
cfg = $.extend({ count: count });
}
} }
var $menu = this; var $menu = this;
var scroll_y = 0; var scroll_y = 0;
var origin_y = 0;
var timeout = null; var timeout = null;
var interval = null;
var height = parseInt($menu.height()); var height = parseInt($menu.height());
var move_timeout = null; var interval_count = 0;
function init_menu() function init_menu()
{ {
@ -40,19 +52,53 @@
{ {
hide_menu(); hide_menu();
timeout = setTimeout(function() { origin_y = $("body").scrollTop();
scroll_y = parseInt(document.body.scrollTop);
$menu.css("top", (scroll_y - height)+"px").css("display", "block");
$menu.animate({ top: scroll_y }, cfg.duration);
return; timeout = setTimeout(function() {
scroll_y = $("body").scrollTop();
if(origin_y == scroll_y) {
$menu.css("top", (scroll_y - height)+"px").css("display", "block");
$menu.animate({ top: scroll_y }, cfg.duration);
}
}, cfg.timeout); }, cfg.timeout);
} }
function hide_menu() function hide_menu()
{ {
clearTimeout(timeout); clearTimeout(timeout);
$menu.clearQueue().stop().hide().css("top", "-"+height+"px"); clearInterval(interval);
$menu.css("display", "none").clearQueue().stop().css("top", "-"+height+"px");
interval_count = 0;
interval = setInterval(check_menu, cfg.interval);
}
function check_menu()
{
clearTimeout(timeout);
if(interval_count == parseInt(cfg.count)) {
clearInterval(interval);
interval_count = 0;
return;
} else {
interval_count++;
}
origin_y = $("body").scrollTop();
timeout = setTimeout(function() {
scroll_y = $("body").scrollTop();
if(origin_y == scroll_y) {
element_y = parseInt($menu.css("top"));
if(!$menu.is(":animated") && ($menu.is(":hidden") || (element_y - scroll_y) != 0)) {
float_menu();
}
}
}, cfg.timeout);
} }
$(window).on("scroll",function(event) { $(window).on("scroll",function(event) {
@ -60,7 +106,7 @@
}); });
$(window).on("resize", function(event) { $(window).on("resize", function(event) {
$(window).trigger("scroll"); float_menu();
}); });
$(window).on("load", function(event) { $(window).on("load", function(event) {
@ -72,17 +118,19 @@
}); });
if(navigator.userAgent.toLowerCase().indexOf("android") > -1) { if(navigator.userAgent.toLowerCase().indexOf("android") > -1) {
$(window).on("touchend", function(event) { $(window).on("touchmove", function(event) {
$(window).trigger("scroll"); hide_menu();
}); });
} }
} }
$.fn.bottomFloatMenu = function(timeout, duration) $.fn.bottomFloatMenu = function(timeout, duration, interval, count)
{ {
var cfg = { var cfg = {
timeout: 300, timeout: 200,
duration: 300 duration: 300,
interval: 500,
count: 10
}; };
if(typeof timeout == "object") { if(typeof timeout == "object") {
@ -95,23 +143,32 @@
if(duration) { if(duration) {
cfg = $.extend({ duration: duration }); cfg = $.extend({ duration: duration });
} }
if(interval) {
cfg = $.extend({ interval: interval });
}
if(count) {
cfg = $.extend({ count: count });
}
} }
var $menu = this; var $menu = this;
var scroll_y = 0; var scroll_y = 0;
var move_y = 0; var origin_y = 0;
var element_y = 0; var element_y = 0;
var top_pos = 0;
var timeout = null; var timeout = null;
var interval = null;
var height = parseInt($menu.height()); var height = parseInt($menu.height());
var w_height = 0; var w_height = 0;
var interval_count = 0;
function init_menu() function init_menu()
{ {
hide_menu(); hide_menu();
timeout = setTimeout(function() { timeout = setTimeout(function() {
scroll_y = parseInt(document.body.scrollTop); scroll_y = $("body").scrollTop();
w_height = $(window).height(); w_height = $(window).height();
element_y = scroll_y + w_height; element_y = scroll_y + w_height;
$menu.css("top", element_y+"px").css("display", "block"); $menu.css("top", element_y+"px").css("display", "block");
@ -123,28 +180,71 @@
{ {
hide_menu(); hide_menu();
w_height = $(window).height(); origin_y = $("body").scrollTop();
scroll_y = parseInt(document.body.scrollTop);
element_y = scroll_y + w_height;
if (/iP(hone|od|ad)/.test(navigator.platform)) {
if(window.innerHeight - $(window).outerHeight(true) > 0)
element_y += (window.innerHeight - $(window).outerHeight(true));
}
timeout = setTimeout(function() { timeout = setTimeout(function() {
$menu.height(0).css("top", element_y+"px").css("display", "block"); scroll_y = $("body").scrollTop();
$menu.animate({
top: "-="+height, if(origin_y == scroll_y) {
height: "+="+height w_height = $(window).height();
}, cfg.duration); element_y = scroll_y + w_height;
if (/iP(hone|od|ad)/.test(navigator.platform)) {
if(window.innerHeight - $(window).outerHeight(true) > 0)
element_y += (window.innerHeight - $(window).outerHeight(true));
}
$menu.height(0).css("top", element_y+"px").css("display", "block");
$menu.animate({
top: "-="+height,
height: "+="+height
}, cfg.duration);
}
}, cfg.timeout); }, cfg.timeout);
} }
function hide_menu() function hide_menu()
{ {
clearTimeout(timeout); clearTimeout(timeout);
$menu.css("top", (w_height + height)+"px").clearQueue().stop().css("display", "none"); clearInterval(interval);
$menu.css("display", "none").css("top", (w_height + height)+"px").clearQueue().stop();
interval_count = 0;
interval = setInterval(check_menu, cfg.interval);
}
function check_menu()
{
clearTimeout(timeout);
if(interval_count == parseInt(cfg.count)) {
clearInterval(interval);
interval_count = 0;
return;
} else {
interval_count++;
}
origin_y = $("body").scrollTop();
timeout = setTimeout(function() {
scroll_y = $("body").scrollTop();
if(origin_y == scroll_y) {
w_height = $(window).height();
element_y = parseInt($menu.css("top"));
var h = 0;
if (/iP(hone|od|ad)/.test(navigator.platform)) {
if(window.innerHeight - $(window).outerHeight(true) > 0)
h = window.innerHeight - $(window).outerHeight(true);
}
if(!$menu.is(":animated") && ($menu.is(":hidden") || element_y != (scroll_y + w_height + h - height))) {
float_menu();
}
}
}, cfg.timeout);
} }
$(window).on("scroll",function(event) { $(window).on("scroll",function(event) {
@ -156,7 +256,7 @@
}); });
$(window).on("resize", function(event) { $(window).on("resize", function(event) {
$(window).trigger("scroll"); float_menu();
}); });
$(window).on("touchstart", function(event) { $(window).on("touchstart", function(event) {
@ -164,8 +264,8 @@
}); });
if(navigator.userAgent.toLowerCase().indexOf("android") > -1) { if(navigator.userAgent.toLowerCase().indexOf("android") > -1) {
$(window).on("touchend", function(event) { $(window).on("touchmove", function(event) {
$(window).trigger("scroll"); hide_menu();
}); });
} }
} }