/************** moPanel Gnb 탭버튼 *************/
$(document).ready(function(){
var $moGnb_li = $('.moGnb>li');
$moGnb_li.on('click', function(e){
e.preventDefault();
var isOn = $(this).children('a').hasClass('on');
if(isOn){
$(this).children('a').removeClass('on');
$(this).children('.sub1').stop().slideUp();
}else {
$moGnb_li.children('a').removeClass('on'); //이미 열린 탭은 다시 닫히게
$moGnb_li.children('.sub1').stop().slideUp();
$(this).children('a').addClass('on');
$(this).children('.sub1').stop().slideDown();
}
});
});
/**************메인 비주얼 슬라이드 *************/
$(document).ready(function(){
var lang = $("html").attr("lang");
jsMain();
});
function jsMain(){
if(!$("#vissual").hasClass("mainV")) return false;
var $zone = $(".title-zone"),
$visual = $(".visual");
$visual.each(function(){
var $bg = $(".bg-img img", this).attr("src");
$(this).css({
"background": "url(" + $bg + ") no-repeat 37% 0",
"background-size": "cover"
});
})
mainSlide();
}
function mainSlide(){
var $visual = $(".visual-section"),
$num = $(".btngroup-num"),
$control = $(".btngroup");
var size = $visual.size();
var s = 1000,
spd = 8000;
// indicator make
var _html = "";
for(var i=1;i<=$visual.size();i++){
if(i==1){
_html += "
"+i+"";
}else{
_html += ""+i+"";
}
}
$num.html(_html);
// move
$(".visual-section").eq(0).addClass("view").siblings().hide();
var interval = setInterval(animation, spd);
function animation(){
// var size = $visual.size(),
var current = $(".on", $num).index();
if(current >= $visual.size() -1){
$visual.eq(current).removeClass("view").stop().fadeOut(s);
$visual.eq(0).stop().fadeIn(s, function(){
$(this).addClass("view");
});
$num.find("li").eq(0).addClass("on").siblings().removeClass('on');
//visual.set($(this),{alpha:0,y:50});
//visual.to($(this),0.9,{alpha:1,y:0,delay:_delay,ease:Back.easeOut});
}else{
$visual.eq(current).removeClass("view").stop().fadeOut(s);
$visual.eq(current+1).stop().fadeIn(s, function(){
$(this).addClass("view");
});
$num.find("li").eq(current+1).addClass("on").siblings().removeClass('on');
}
}
// control
$control.find("button").on("click", function(){
var $parent = $(this).parents(".btn");
$parent.removeClass("on").siblings().addClass("on");
if($parent.hasClass("play")){
interval = setInterval(animation, spd);
}else{
clearInterval(interval);
}
return false;
})
// indicator
$num.find("li").on("click", function(){
clearInterval(interval);
var $this = $(this),
current = $this.index();
$this.addClass("on").siblings().removeClass("on");
$(".visual-section.view").removeClass("view").stop().fadeOut(s);
$visual.eq(current).stop().fadeIn(s, function(){
$(this).addClass("view");
if($(".btngroup .on").hasClass("stop")){
interval = setInterval(animation, spd);
}
});
})
}
jQuery(function($){
// 占쏙옙크占싼억옙占쏙옙占쌤몌옙占�
var $moveTxt = $('.scroll-icon');
var moveTEXT = setInterval(function() {
$moveTxt.animate({opacity:'.5',"bottom":'+=20px'}).animate({opacity:'1',"bottom":'-=20px'})
}, 1000);
$moveTxt.click(function () {
$("html, body").animate({scrollTop: $("#productContent").offset().top + 50 },600,"swing");
return false;
});
// 占쏙옙占쏙옙 占쏙옙占쏙옙 占쌨댐옙
});
/**************메인 카운터링 *************/
(function ($) {
$.fn.countTo = function (options) {
options = options || {};
return $(this).each(function () {
// set options for current element
var settings = $.extend({}, $.fn.countTo.defaults, {
from: $(this).data('from'),
to: $(this).data('to'),
speed: $(this).data('speed'),
refreshInterval: $(this).data('refresh-interval'),
decimals: $(this).data('decimals')
}, options);
// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(settings.speed / settings.refreshInterval),
increment = (settings.to - settings.from) / loops;
// references & variables that will change with each update
var self = this,
$self = $(this),
loopCount = 0,
value = settings.from,
data = $self.data('countTo') || {};
$self.data('countTo', data);
// if an existing interval can be found, clear it first
if (data.interval) {
clearInterval(data.interval);
}
data.interval = setInterval(updateTimer, settings.refreshInterval);
// initialize the element with the starting value
render(value);
function updateTimer() {
value += increment;
loopCount++;
render(value);
if (typeof(settings.onUpdate) == 'function') {
settings.onUpdate.call(self, value);
}
if (loopCount >= loops) {
// remove the interval
$self.removeData('countTo');
clearInterval(data.interval);
value = settings.to;
if (typeof(settings.onComplete) == 'function') {
settings.onComplete.call(self, value);
}
}
}
function render(value) {
var formattedValue = settings.formatter.call(self, value, settings);
$self.html(formattedValue);
}
});
};
$.fn.countTo.defaults = {
from: 0, // the number the element should start at
to: 0, // the number the element should end at
speed: 1000, // how long it should take to count between the target numbers
refreshInterval: 100, // how often the element should be updated
decimals: 0, // the number of decimal places to show
formatter: formatter, // handler for formatting the value before rendering
onUpdate: null, // callback method for every time the element is updated
onComplete: null // callback method for when the element finishes updating
};
function formatter(value, settings) {
return value.toFixed(settings.decimals);
}
}(jQuery));
jQuery(function ($) {
// custom formatting example
$('.count-number').data('countToOptions', {
formatter: function (value, options) {
return value.toFixed(options.decimals).replace(/\B(?=(?:\d{3})+(?!\d))/g, ',');
}
});
// start all the timers
$('.timer').each(count);
function count(options) {
var $this = $(this);
options = $.extend({}, options || {}, $this.data('countToOptions') || {});
$this.countTo(options);
}
});
/************** 페이지 스크롤시 fade in *************/
$(window).on("load", function () {
function fade() {
let animation_height = $(window).innerHeight() * 0.5;
let ratio = Math.round((1 / animation_height) * 10000) / 10000;
$(".fade").each(function () {
let objectTop = $(this).offset().top;
let windowBottom = $(window).scrollTop() + $(window).innerHeight();
if (objectTop < windowBottom) {
if (objectTop < windowBottom - animation_height) {
$(this).css({
transition: "opacity 0.3s linear",
transition: "top 0.3s linear",
opacity: 1,
top: "0px",
});
} else {
$(this).css({
transition: "opacity 0.3s linear",
opacity: (windowBottom - objectTop) * ratio,
transition: "top 0.3s linear",
top: `${200 * (1 - (windowBottom - objectTop) * ratio)}px`,
});
}
} else {
$(this).css({
opacity: 0,
top: "200px",
});
}
});
}
$(".fade").css({
opacity: 0,
top: "200px",
});
fade();
$(window).scroll(function () {
fade();
});
});
/************** 스와이프 오토 슬라이드 *************/