From a6c3e4ea6a62d0ce2a060348d598678349b4df5c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?geun1416=28=EA=B9=80=EC=A7=80=EC=9D=80=29?= <1416geun@palnet.co.kr> Date: Mon, 16 May 2022 17:52:59 +0900 Subject: [PATCH] =?UTF-8?q?=ED=97=A4=EB=8D=94=EC=88=98=EC=A0=95,=EC=95=B5?= =?UTF-8?q?=EC=BB=A4=EA=B8=B0=EB=8A=A5=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- html/css/common.css | 12 +- html/include/header.html | 16 +-- html/index.html | 19 +-- html/js/common.js | 35 ++++-- html/js/scrolloverflow.min.js | 15 +++ html/js/scrollspy.js | 225 ---------------------------------- 6 files changed, 63 insertions(+), 259 deletions(-) create mode 100644 html/js/scrolloverflow.min.js delete mode 100644 html/js/scrollspy.js diff --git a/html/css/common.css b/html/css/common.css index 37c64e8..2f68d7c 100644 --- a/html/css/common.css +++ b/html/css/common.css @@ -10,7 +10,7 @@ body,html{ /*header*/ #hd {z-index:1000;position:fixed;width:100%; top:0;overflow:hidden; transition:0.6s ease; -webkit-transition:0.6s ease;} -#hd:hover{background:#fff; border-bottom:1px solid #ddd;} +#hd:hover{background:#fff; border-bottom:1px solid rgba(0, 0, 0, 0.5);} #hd_h1 {position:absolute;font-size:0;line-height:0;overflow:hidden} #logo a{display:block;padding:20px;} #logo a img{width:200px;} @@ -24,12 +24,12 @@ body,html{ #gnb ul:after {display:block;visibility:hidden;clear:both;content:""} #gnb .gnb_1dli{line-height:100px;position:relative;width:25%;max-width:220px;} -.gnb_1dli .bg{display:none;width:10px;height:10px;overflow:hidden;background:url(../img/gnb_bg2.gif) no-repeat 50% 50%;text-indent:-999px} +.gnb_1dli .bg{display:none;width:10px;height:10px;overflow:hidden;} .gnb_1da {width:100%;display:inline-block;font-weight:500;color:#fff;text-decoration:none; font-size:20px;} .gnb_2dli{line-height:36px; padding:0 0 10px; font-size:18px; font-weight:400;} .gnb_2dli:first-child{border:0} .gnb_2dul {display:block;padding: 0; height:0; overflow:hidden;} -.gnb_2da {color:#222;text-align:left;text-decoration:none} +.gnb_2da {color:rgba(255,255,255,0.7);text-align:left;text-decoration:none} /*slidesNav*/ @@ -41,11 +41,13 @@ body,html{ .main-bn h2{font-size:3rem;font-weight:500;color:rgba(255,255,255,0.8);} .main-bn .big{display:block;font-size:6rem;color:#fff;font-weight:bold;} .main-bn .sm{display:block;font-size:1.25rem;color:rgba(255,255,255,0.8);margin:10px 0 0 10px;} -.main-bn .txt-box{font-size:1.25rem;font-weight:300;color:rgba(255,255,255,0.8);line-height:1.5;} -.main-bn .txt-box b{font-size:3rem;} +.txt-box{font-size:1.25rem;font-weight:300;color:rgba(255,255,255,0.8);line-height:1.5;} +.txt-box b{font-size:3rem;} .bg-canvas{position: absolute;top:0;opacity:0.3;} +.bg-square{display:block;border:20px solid rgba(255,255,255,0.2);width:250px;height:250px;position:absolute;top:-160px;} .bg01{background:url('../images/bg01.jpg');} .bg02{background:url('../images/bg02.jpg');} +.bg02 .txt-box{padding-left:134px;} .scroll-animation {position:absolute;left:50%;transform: translateX(-50%);bottom:40px;} .scroll-box span{display:block;text-align:center;color:rgba(255,255,255,0.8);font-size:0.875rem;font-weight:300;animation: updown 1s ease-in-out 0.3s infinite normal;} .scroll-box span.scroll-icon{margin:10px auto;fill:#fff;width:30px;} diff --git a/html/include/header.html b/html/include/header.html index 04937e5..66464a1 100644 --- a/html/include/header.html +++ b/html/include/header.html @@ -2,19 +2,19 @@ //헤더 풀다운메뉴 $(document).ready(function () { $('#hd').on('mouseenter', function () { - $('#hd').css('background', 'rgb(255, 255, 255, 1)'); + $('#hd').css('background', 'rgba(0, 0, 0, 0.4)'); $('.gnb_2dul').stop().animate({ 'height': '220px' }, 250); - $('.gnb_1da').css('color', '#000'); - $('.color_logo').css('display', 'block'); - $('.wh_logo').css('display', 'none'); + $('.gnb_1da').css('color', '#fff'); + // $('.color_logo').css('display', 'block'); + // $('.wh_logo').css('display', 'none'); }); $('#hd').on('mouseleave', function () { - $('#hd').css('background', 'rgb(255, 255, 255, 0)'); + $('#hd').css('background', 'rgba(0, 0, 0, 0)'); $('.gnb_2dul').stop().animate({ 'height': '-100px' }, 250); $('.gnb_1da').css('color', '#fff'); - $('.wh_logo').css('display', 'block'); - $('.color_logo').css('display', 'none'); + // $('.wh_logo').css('display', 'block'); + // $('.color_logo').css('display', 'none'); }); }); @@ -29,7 +29,7 @@ diff --git a/html/index.html b/html/index.html index 90a7f1b..b05ea56 100644 --- a/html/index.html +++ b/html/index.html @@ -24,6 +24,7 @@ + @@ -57,29 +58,31 @@
-

가치를 존중하며 신뢰를 바탕으로 실천하는 기업

+

가치를 존중하며 신뢰를 바탕으로 실천하는 기업

PAL Networks 항공·전문 IT산업분야의 소프트웨어 개발 전문 기업
- +
+
-

+ +

팔네트웍스
- ‘인천 항공 산업 선도기업’ 유망기업으로 선정된
 항공 소프트웨어 전문 기업입니다. + ‘인천 항공 산업 선도기업’ 유망기업으로 선정된 항공 소프트웨어 전문 기업입니다.

-
-
diff --git a/html/js/common.js b/html/js/common.js index b33e5db..3e99961 100644 --- a/html/js/common.js +++ b/html/js/common.js @@ -1,6 +1,27 @@ $(function(){ new WOW().init(); AOS.init(); + $('[data-aos]').each(function(){ $(this).addClass("aos-init"); }); + new fullpage('#fullpage', { + licenseKey: '13F1F552-6ACE43B7-95262729-9E0B4778', + //options here + anchors:['home', 'works', 'skills', 'contact'], + autoScrolling:true, + scrollHorizontally: true, + navigation:true, + navigationPosition:'right', + scrollBar: true, + onLeave: function(){ + new WOW().init(); + } + }); + + //methods + $.fn.fullpage.setAllowScrolling(false); +}); + + +$(function(){ new Swiper('.swiper-container'); const swiper = new Swiper('.swiper-container', { //기본 셋팅 @@ -41,19 +62,7 @@ $(function(){ prevEl: '.swiper-button-prev', }, }); - - new fullpage('#fullpage', { - licenseKey: '13F1F552-6ACE43B7-95262729-9E0B4778', - //options here - autoScrolling:true, - scrollHorizontally: true, - navigation:true, - navigationPosition:'right', - scrollBar: true - }); - - //methods - $.fn.fullpage.setAllowScrolling(true); + }); diff --git a/html/js/scrolloverflow.min.js b/html/js/scrolloverflow.min.js new file mode 100644 index 0000000..6b42f30 --- /dev/null +++ b/html/js/scrolloverflow.min.js @@ -0,0 +1,15 @@ +/** +* Customized version of iScroll.js 0.1.3 +* It fixes bugs affecting its integration with fullpage.js +* @license +*/ +!function(r,n,p){var f=r.requestAnimationFrame||r.webkitRequestAnimationFrame||r.mozRequestAnimationFrame||r.oRequestAnimationFrame||r.msRequestAnimationFrame||function(t){r.setTimeout(t,1e3/60)},m=function(){var e={},o=n.createElement("div").style,i=function(){for(var t=["t","webkitT","MozT","msT","OT"],i=0,s=t.length;io+this.options.directionLockThreshold?this.directionLocked="h":o>=e+this.options.directionLockThreshold?this.directionLocked="v":this.directionLocked="n"),"h"==this.directionLocked){if("vertical"==this.options.eventPassthrough)t.preventDefault();else if("horizontal"==this.options.eventPassthrough)return void(this.initiated=!1);h=0}else if("v"==this.directionLocked){if("horizontal"==this.options.eventPassthrough)t.preventDefault();else if("vertical"==this.options.eventPassthrough)return void(this.initiated=!1);r=0}r=this.hasHorizontalScroll?r:0,h=this.hasVerticalScroll?h:0,i=this.x+r,s=this.y+h,(0-this.scrollerWidth;){for(this.pages[r]=[],o=t=0;o>-this.scrollerHeight;)this.pages[r][t]={x:p.max(a,this.maxScrollX),y:p.max(o,this.maxScrollY),width:l,height:c,cx:a-s,cy:o-e},o-=c,t++;a-=l,r++}else for(t=(n=this.options.snap).length,i=-1;rthis.maxScrollX&&h++;this.goToPage(this.currentPage.pageX||0,this.currentPage.pageY||0,0),this.options.snapThreshold%1==0?(this.snapThresholdX=this.options.snapThreshold,this.snapThresholdY=this.options.snapThreshold):(this.snapThresholdX=p.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].width*this.options.snapThreshold),this.snapThresholdY=p.round(this.pages[this.currentPage.pageX][this.currentPage.pageY].height*this.options.snapThreshold))}}),this.on("flick",function(){var t=this.options.snapSpeed||p.max(p.max(p.min(p.abs(this.x-this.startX),1e3),p.min(p.abs(this.y-this.startY),1e3)),300);this.goToPage(this.currentPage.pageX+this.directionX,this.currentPage.pageY+this.directionY,t)})},_nearestSnap:function(t,i){if(!this.pages.length)return{x:0,y:0,pageX:0,pageY:0};var s=0,e=this.pages.length,o=0;if(p.abs(t-this.absStartX)=this.pages[s][0].cx){t=this.pages[s][0].x;break}for(e=this.pages[s].length;o=this.pages[0][o].cy){i=this.pages[0][o].y;break}return s==this.currentPage.pageX&&((s+=this.directionX)<0?s=0:s>=this.pages.length&&(s=this.pages.length-1),t=this.pages[s][0].x),o==this.currentPage.pageY&&((o+=this.directionY)<0?o=0:o>=this.pages[0].length&&(o=this.pages[0].length-1),i=this.pages[0][o].y),{x:t,y:i,pageX:s,pageY:o}},goToPage:function(t,i,s,e){e=e||this.options.bounceEasing,t>=this.pages.length?t=this.pages.length-1:t<0&&(t=0),i>=this.pages[t].length?i=this.pages[t].length-1:i<0&&(i=0);var o=this.pages[t][i].x,n=this.pages[t][i].y;s=void 0===s?this.options.snapSpeed||p.max(p.max(p.min(p.abs(o-this.x),1e3),p.min(p.abs(n-this.y),1e3)),300):s,this.currentPage={x:o,y:n,pageX:t,pageY:i},this.scrollTo(o,n,s,e)},next:function(t,i){var s=this.currentPage.pageX,e=this.currentPage.pageY;++s>=this.pages.length&&this.hasVerticalScroll&&(s=0,e++),this.goToPage(s,e,t,i)},prev:function(t,i){var s=this.currentPage.pageX,e=this.currentPage.pageY;--s<0&&this.hasVerticalScroll&&(s=0,e--),this.goToPage(s,e,t,i)},_initKeys:function(t){var i,s={pageUp:33,pageDown:34,end:35,home:36,left:37,up:38,right:39,down:40};if("object"==typeof this.options.keyBindings)for(i in this.options.keyBindings)"string"==typeof this.options.keyBindings[i]&&(this.options.keyBindings[i]=this.options.keyBindings[i].toUpperCase().charCodeAt(0));else this.options.keyBindings={};for(i in s)this.options.keyBindings[i]=this.options.keyBindings[i]||s[i];m.addEvent(r,"keydown",this),this.on("destroy",function(){m.removeEvent(r,"keydown",this)})},_key:function(t){if(this.enabled){var i,s=this.options.snap,e=s?this.currentPage.pageX:this.x,o=s?this.currentPage.pageY:this.y,n=m.getTime(),r=this.keyTime||0;switch(this.options.useTransition&&this.isInTransition&&(i=this.getComputedPosition(),this._translate(p.round(i.x),p.round(i.y)),this.isInTransition=!1),this.keyAcceleration=n-r<200?p.min(this.keyAcceleration+.25,50):0,t.keyCode){case this.options.keyBindings.pageUp:this.hasHorizontalScroll&&!this.hasVerticalScroll?e+=s?1:this.wrapperWidth:o+=s?1:this.wrapperHeight;break;case this.options.keyBindings.pageDown:this.hasHorizontalScroll&&!this.hasVerticalScroll?e-=s?1:this.wrapperWidth:o-=s?1:this.wrapperHeight;break;case this.options.keyBindings.end:e=s?this.pages.length-1:this.maxScrollX,o=s?this.pages[0].length-1:this.maxScrollY;break;case this.options.keyBindings.home:o=e=0;break;case this.options.keyBindings.left:e+=s?-1:5+this.keyAcceleration>>0;break;case this.options.keyBindings.up:o+=s?1:5+this.keyAcceleration>>0;break;case this.options.keyBindings.right:e-=s?-1:5+this.keyAcceleration>>0;break;case this.options.keyBindings.down:o-=s?1:5+this.keyAcceleration>>0;break;default:return}s?this.goToPage(e,o):(0this.maxBoundaryX?t="scale"==this.options.shrink?(this.width=p.max(this.indicatorWidth-(t-this.maxPosX),8),this.indicatorStyle.width=this.width+"px",this.maxPosX+this.indicatorWidth-this.width):this.maxBoundaryX:"scale"==this.options.shrink&&this.width!=this.indicatorWidth&&(this.width=this.indicatorWidth,this.indicatorStyle.width=this.width+"px"),ithis.maxBoundaryY?i="scale"==this.options.shrink?(this.height=p.max(this.indicatorHeight-3*(i-this.maxPosY),8),this.indicatorStyle.height=this.height+"px",this.maxPosY+this.indicatorHeight-this.height):this.maxBoundaryY:"scale"==this.options.shrink&&this.height!=this.indicatorHeight&&(this.height=this.indicatorHeight,this.indicatorStyle.height=this.height+"px")),this.x=t,this.y=i,this.scroller.options.useTransform?this.indicatorStyle[m.style.transform]="translate("+t+"px,"+i+"px)"+this.scroller.translateZ:(this.indicatorStyle.left=t+"px",this.indicatorStyle.top=i+"px")},_pos:function(t,i){t<0?t=0:t>this.maxPosX&&(t=this.maxPosX),i<0?i=0:i>this.maxPosY&&(i=this.maxPosY),t=this.options.listenX?p.round(t/this.sizeRatioX):this.scroller.x,i=this.options.listenY?p.round(i/this.sizeRatioY):this.scroller.y,this.scroller.scrollTo(t,i)},fade:function(t,i){if(!i||this.visible){clearTimeout(this.fadeTimeout),this.fadeTimeout=null;var s=t?250:500,e=t?0:300;t=t?"1":"0",this.wrapperStyle[m.style.transitionDuration]=s+"ms",this.fadeTimeout=setTimeout(function(t){this.wrapperStyle.opacity=t,this.visible=+t}.bind(this,t),e)}}},t.utils=m,"undefined"!=typeof module&&module.exports?module.exports=t:"function"==typeof define&&define.amd?(define(function(){return t}),void 0!==r&&(r.IScroll=t)):r.IScroll=t}(window,document,Math), +/*! +* Scrolloverflow 2.0.6 module for fullPage.js >= 3 +* https://github.com/alvarotrigo/fullPage.js +* @license MIT licensed +* +* Copyright (C) 2015 alvarotrigo.com - A project by Alvaro Trigo +*/ +function(l,c){l.fp_scrolloverflow=function(){l.IScroll||(l.IScroll=module.exports);var s="fp-scrollable",n="."+s,t=".active",d=".fp-section",e=d+t,o=".fp-slide",u=".fp-tableCell";function r(){var p=this;function s(){fp_utils.hasClass(c.body,"fp-responsive")?i(e):i(t)}function t(t){if(!fp_utils.hasClass(t,"fp-noscroll")){fp_utils.css(t,{overflow:"hidden"});var i,s,e,o=p.options.scrollOverflowHandler,n=o.wrapContent(),r=fp_utils.closest(t,d),h=o.scrollable(t),a=(s=r,null!=(e=fp_utils.closest(s,d))?parseInt(getComputedStyle(e)["padding-bottom"])+parseInt(getComputedStyle(e)["padding-top"]):0);null!=h?i=o.scrollHeight(t):(i=t.scrollHeight,p.options.verticalCentered&&(i=f(u,t)[0].scrollHeight));var l=fp_utils.getWindowHeight(),c=l-a;l=i.scrollHeight}},scrollable:function(t){return f(".fp-slides",t).length?f(n,f(".fp-slide.active",t)[0])[0]:f(n,t)[0]},scrollHeight:function(t){return f(".fp-scroller",f(n,t)[0])[0].scrollHeight},remove:function(t){if(null!=t){var i=f(n,t)[0];if(null!=i){var s=i.fp_iscrollInstance;null!=s&&s.destroy(),i.fp_iscrollInstance=null,fp_utils.unwrap(f(".fp-scroller",t)[0]),fp_utils.unwrap(f(n,t)[0])}}},update:function(t,i){clearTimeout(a.refreshId),a.refreshId=setTimeout(function(){a.iScrollInstances.forEach(function(t){t.refresh(),fullpage_api.silentMoveTo(fp_utils.index(f(e)[0])+1)})},150),fp_utils.css(f(n,t)[0],{height:i+"px"}),h.verticalCentered&&fp_utils.css(f(n,t)[0].parentNode,{height:i+"px"})},wrapContent:function(){var t=c.createElement("div");t.className=s;var i=c.createElement("div");return i.className="fp-scroller",{scrollable:t,scroller:i}}};return{iscrollHandler:a}}()}(window,document); +//# sourceMappingURL=scrolloverflow.min.js.map diff --git a/html/js/scrollspy.js b/html/js/scrollspy.js deleted file mode 100644 index f615bfa..0000000 --- a/html/js/scrollspy.js +++ /dev/null @@ -1,225 +0,0 @@ -/** - * Extend jquery with a scrollspy plugin. - * This watches the window scroll and fires events when elements are scrolled into viewport. - * - * throttle() and getTime() taken from Underscore.js - * https://github.com/jashkenas/underscore - * - * @author Copyright 2013 John Smart - * @license https://raw.github.com/thesmart/jquery-scrollspy/master/LICENSE - * @see https://github.com/thesmart - * @version 0.1.2 - */ - (function($) { - - var jWindow = $(window); - var elements = []; - var elementsInView = []; - var isSpying = false; - var ticks = 0; - var offset = { - top : 0, - right : 0, - bottom : 0, - left : 0, - } - - /** - * Find elements that are within the boundary - * @param {number} top - * @param {number} right - * @param {number} bottom - * @param {number} left - * @return {jQuery} A collection of elements - */ - function findElements(top, right, bottom, left) { - var hits = $(); - $.each(elements, function(i, element) { - var elTop = element.offset().top, - elLeft = element.offset().left, - elRight = elLeft + element.width(), - elBottom = elTop + element.height(); - - var isIntersect = !(elLeft > right || - elRight < left || - elTop > bottom || - elBottom < top); - - if (isIntersect) { - hits.push(element); - } - }); - - return hits; - } - - /** - * Called when the user scrolls the window - */ - function onScroll() { - // unique tick id - ++ticks; - - // viewport rectangle - var top = jWindow.scrollTop(), - left = jWindow.scrollLeft(), - right = left + jWindow.width(), - bottom = top + jWindow.height(); - - // determine which elements are in view - var intersections = findElements(top+offset.top, right+offset.right, bottom+offset.bottom, left+offset.left); - $.each(intersections, function(i, element) { - var lastTick = element.data('scrollSpy:ticks'); - if (typeof lastTick != 'number') { - // entered into view - element.triggerHandler('scrollSpy:enter'); - } - - // update tick id - element.data('scrollSpy:ticks', ticks); - }); - - // determine which elements are no longer in view - $.each(elementsInView, function(i, element) { - var lastTick = element.data('scrollSpy:ticks'); - if (typeof lastTick == 'number' && lastTick !== ticks) { - // exited from view - element.triggerHandler('scrollSpy:exit'); - element.data('scrollSpy:ticks', null); - } - }); - - // remember elements in view for next tick - elementsInView = intersections; - } - - /** - * Called when window is resized - */ - function onWinSize() { - jWindow.trigger('scrollSpy:winSize'); - } - - /** - * Get time in ms - * @license https://raw.github.com/jashkenas/underscore/master/LICENSE - * @type {function} - * @return {number} - */ - var getTime = (Date.now || function () { - return new Date().getTime(); - }); - - /** - * Returns a function, that, when invoked, will only be triggered at most once - * during a given window of time. Normally, the throttled function will run - * as much as it can, without ever going more than once per `wait` duration; - * but if you'd like to disable the execution on the leading edge, pass - * `{leading: false}`. To disable execution on the trailing edge, ditto. - * @license https://raw.github.com/jashkenas/underscore/master/LICENSE - * @param {function} func - * @param {number} wait - * @param {Object=} options - * @returns {Function} - */ - function throttle(func, wait, options) { - var context, args, result; - var timeout = null; - var previous = 0; - options || (options = {}); - var later = function () { - previous = options.leading === false ? 0 : getTime(); - timeout = null; - result = func.apply(context, args); - context = args = null; - }; - return function () { - var now = getTime(); - if (!previous && options.leading === false) previous = now; - var remaining = wait - (now - previous); - context = this; - args = arguments; - if (remaining <= 0) { - clearTimeout(timeout); - timeout = null; - previous = now; - result = func.apply(context, args); - context = args = null; - } else if (!timeout && options.trailing !== false) { - timeout = setTimeout(later, remaining); - } - return result; - }; - }; - - /** - * Enables ScrollSpy using a selector - * @param {jQuery|string} selector The elements collection, or a selector - * @param {Object=} options Optional. - throttle : number -> scrollspy throttling. Default: 100 ms - offsetTop : number -> offset from top. Default: 0 - offsetRight : number -> offset from right. Default: 0 - offsetBottom : number -> offset from bottom. Default: 0 - offsetLeft : number -> offset from left. Default: 0 - * @returns {jQuery} - */ - $.scrollSpy = function(selector, options) { - selector = $(selector); - selector.each(function(i, element) { - elements.push($(element)); - }); - options = options || { - throttle: 100 - }; - - offset.top = options.offsetTop || 0; - offset.right = options.offsetRight || 0; - offset.bottom = options.offsetBottom || 0; - offset.left = options.offsetLeft || 0; - - var throttledScroll = throttle(onScroll, options.throttle || 100); - var readyScroll = function(){ - $(document).ready(throttledScroll); - }; - - if (!isSpying) { - jWindow.on('scroll', readyScroll); - jWindow.on('resize', readyScroll); - isSpying = true; - } - - // perform a scan once, after current execution context, and after dom is ready - setTimeout(readyScroll, 0); - - return selector; - }; - - /** - * Listen for window resize events - * @param {Object=} options Optional. Set { throttle: number } to change throttling. Default: 100 ms - * @returns {jQuery} $(window) - */ - $.winSizeSpy = function(options) { - $.winSizeSpy = function() { return jWindow; }; // lock from multiple calls - options = options || { - throttle: 100 - }; - return jWindow.on('resize', throttle(onWinSize, options.throttle || 100)); - }; - - /** - * Enables ScrollSpy on a collection of elements - * e.g. $('.scrollSpy').scrollSpy() - * @param {Object=} options Optional. - throttle : number -> scrollspy throttling. Default: 100 ms - offsetTop : number -> offset from top. Default: 0 - offsetRight : number -> offset from right. Default: 0 - offsetBottom : number -> offset from bottom. Default: 0 - offsetLeft : number -> offset from left. Default: 0 - * @returns {jQuery} - */ - $.fn.scrollSpy = function(options) { - return $.scrollSpy($(this), options); - }; - -})(jQuery); \ No newline at end of file