(function($) {
var types = ['DOMMouseScroll', 'mousewheel'];
$.event.special.mousewheel = {
setup: function() {
if ( this.addEventListener )
for ( var i=types.length; i; )
this.addEventListener( types[--i], handler, false );
else
this.onmousewheel = handler;
},
teardown: function() {
if ( this.removeEventListener )
for ( var i=types.length; i; )
this.removeEventListener( types[--i], handler, false );
else
this.onmousewheel = null;
}
};
$.fn.extend({
mousewheel: function(fn) {
return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
},
unmousewheel: function(fn) {
return this.unbind("mousewheel", fn);
}
});
function handler(event) {
var args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true;
event = $.event.fix(event || window.event);
event.type = "mousewheel";
if ( event.wheelDelta ) delta = event.wheelDelta/120;
if ( event.detail ) delta = -event.detail/3;
// Add events and delta to the front of the arguments
args.unshift(event, delta);
return $.event.handle.apply(this, args);
}
})(jQuery);
/*-------------*/
(function ($)
{
jQuery.fn.boutique = function (bA)
{
var ba = $.extend(
{
starter : 1, speed : 600, behind_opac : 0.4, back_opac : 0.15, behind_size : 0.7, back_size : 0.4,
autoplay : false, autointerval : 3000, freescroll : true, hovergrowth : 0.08, easing : 'easeInOutQuad',
move_twice_easein : 'easeInCirc', move_twice_easeout : 'easeOutCirc', text_front_only : true
}, bA);
$(this).each(function ()
{
var c, easingplugin, header, hoverspeed, $newitem1, $newitem2, $newitem3, $newitem4, $newitem5,
eazing, zpeed, next, iegrow, container_width, container_height, front_img_width, front_img_height,
text_opacity;
var d = $(this).attr('id');
var e = d + '_item1';
var f = d + '_item2';
var g = d + '_item3';
var h = d + '_item4';
var i = d + '_item5';
var j = false;
var k = ba.starter;
var l = $(this).find(' li').length;
var m = false;
var n = false;
if ($.browser.msie) {
m = true;
if ($.browser.version == '6.0') {
n = true;
}
}
if (ba.hoverspeed) {
hoverspeed = ba.hoverspeed
}
else {
hoverspeed = (ba.speed / 4)
}
if (ba.starter > l) {
ba.starter = l
}
if ($.easing.def) {
easingplugin = true;
$.easing.def = ba.easing
}
else {
easingplugin = false
}
var o = $(this);
var p = $('li', o);
var x = 1;
var q = new Array();
p.each(function ()
{
$(this).addClass('li' + x);
header = $(this).find('img').attr('alt');
if (!$(this).find('span').length)
{
if ($(this).find('a').length) {
$(this).children('a').append('')
}
else {
$(this).append('')
}
if (header == '') {
$(this).find('span').hide()
}
}
$(this).find('span').prepend('
' + header + '
');
if (header == '') {
$(this).find('h6').hide()
}
q[x] = $('.li' + x, o);
x++
});
if (l == 1) {
q[1].clone().attr('id', e).prependTo(o);
q[1].clone().attr('id', f).prependTo(o)
}
else if (ba.starter == 2) {
q[1].clone().attr('id', f).prependTo(o);
q[l].clone().attr('id', e).prependTo(o)
}
else if (ba.starter == 1) {
q[l - 1].clone().attr('id', e).prependTo(o);
q[l].clone().attr('id', f).prependTo(o)
}
else
{
q[ba.starter - 1].clone().attr('id', f).prependTo(o);
q[ba.starter - 2].clone().attr('id', e).prependTo(o)
}
q[ba.starter].clone().attr('id', g).prependTo(o);
if (l == 1) {
q[1].clone().attr('id', h).prependTo(o);
q[1].clone().attr('id', i).prependTo(o)
}
else if (ba.starter == (l - 1)) {
q[l].clone().attr('id', h).prependTo(o);
q[1].clone().attr('id', i).prependTo(o)
}
else if (ba.starter == l) {
q[1].clone().attr('id', h).prependTo(o);
q[2].clone().attr('id', i).prependTo(o)
}
else
{
q[ba.starter + 1].clone().attr('id', h).prependTo(o);
q[ba.starter + 2].clone().attr('id', i).prependTo(o)
}
var r = $('#' + e);
var s = $('#' + f);
var t = $('#' + g);
var u = $('#' + h);
var v = $('#' + i);
r.show().animate({
opacity : 0
}, 0).addClass('back');
s.show().animate({
opacity : 0
}, 0).addClass('behind');
t.show().animate({
opacity : 0
}, 0).addClass('front');
u.show().animate({
opacity : 0
}, 0).addClass('behind');
v.show().animate({
opacity : 0
}, 0).addClass('back');
var w = $('.back', o);
var y = $('.behind', o);
var z = $('.front', o);
if (ba.container_width) {
container_width = ba.container_width
}
else {
container_width = parseInt(o.css('width'))
}
if (ba.front_img_width) {
front_img_width = ba.front_img_width
}
else {
front_img_width = parseInt($('img', z).css('width'))
}
if (ba.front_img_height) {
front_img_height = ba.front_img_height
}
else {
front_img_height = parseInt($('img', z).css('height'))
}
if (ba.text_opacity) {
text_opacity = ba.text_opacity
}
else {
text_opacity = parseFloat($('span', o).css('opacity'))
}
var A = parseInt(p.css('borderLeftWidth'));
var B = parseInt(p.css('padding-left'));
var C = $('h6', z).css('font-size');
var D = $('span', z).css('font-size');
var E = z.css('margin-top');
var F = parseInt($('img', z).css('margin-left'));
var G = Math.round(front_img_width + (F * 2) + (B * 2) + (A * 2));
var H = Math.round(front_img_height + (F * 2) + (B * 2) + (A * 2));
var I = Math.round(front_img_width * ba.behind_size);
var J = Math.round(front_img_height * ba.behind_size);
var K = $('h6', y).css('font-size');
var L = $('span', y).css('font-size');
var M = y.css('margin-top');
var N = parseInt($('img', y).css('margin-left'));
var O = Math.round(I + (N * 2) + (B * 2) + (A * 2));
var P = Math.round(J + (N * 2) + (B * 2) + (A * 2));
var Q = Math.round(front_img_width * ba.back_size);
var R = Math.round(front_img_height * ba.back_size);
var S = $('h6', w).css('font-size');
var T = $('span', w).css('font-size');
var U = w.css('margin-top');
var V = parseInt($('img', w).css('margin-left'));
var W = Math.round(Q + (V * 2) + (B * 2) + (A * 2));
var X = Math.round(R + (V * 2) + (B * 2) + (A * 2));
var Y = Math.round((container_width / 4) - (O / 2));
var Z = Math.round((container_width / 2) - (G / 2));
var bb = (container_width - Y - O);
var bc = (container_width - W);
w.removeClass('back');
y.removeClass('behind');
z.removeClass('front');
var bd = $('span', p).css('padding-top');
var be = $('span', p).css('padding-right');
var bf = $('span', p).css('padding-bottom');
var bg = $('span', p).css('padding-left');
var bh = Math.round(parseInt(bd) * 0.8) + 'px';
var bi = Math.round(parseInt(be) * 0.8) + 'px';
var bj = Math.round(parseInt(bf) * 0.8) + 'px';
var bk = Math.round(parseInt(bg) * 0.8) + 'px';
var bl = Math.round(parseInt(bd) * 0.6) + 'px';
var bm = Math.round(parseInt(be) * 0.6) + 'px';
var bn = Math.round(parseInt(bf) * 0.6) + 'px';
var bo = Math.round(parseInt(bg) * 0.6) + 'px';
var bp =
{
'font-size' : D, 'padding-top' : bd, 'padding-right' : be, 'padding-bottom' : bf, 'padding-left' : bg
};
var bq =
{
'font-size' : L, 'padding-top' : bh, 'padding-right' : bi, 'padding-bottom' : bj, 'padding-left' : bk
};
var br =
{
'font-size' : T, 'padding-top' : bl, 'padding-right' : bm, 'padding-bottom' : bn, 'padding-left' : bo
};
if (ba.text_front_only)
{
bp = $.extend({
'opacity' : text_opacity
}, bp);
bq = $.extend({
'opacity' : 0
}, bq);
br = $.extend({
'opacity' : 0
}, br)
}
if (n)
{
var bs = (parseInt($('span:visible', z).css('margin-left')) + parseInt($('span:visible',
z).css('margin-right')));
var bt = (parseInt($('span:visible', y).css('margin-left')) + parseInt($('span:visible',
y).css('margin-right')));
var bu = (parseInt($('span:visible', w).css('margin-left')) + parseInt($('span:visible',
w).css('margin-right')));
var bv = $.extend({
width : G - parseInt(be) - parseInt(bg) - bs - (A * 2)
}, bp);
var bw = $.extend({
width : O - parseInt(bi) - parseInt(bk) - bt - (A * 2)
}, bq);
var bx = $.extend({
width : W - parseInt(bm) - parseInt(bo) - bu - (A * 2)
}, br)
}
var by = (H + parseInt(E));
var bz = (P + parseInt(M));
var bB = (X + parseInt(U));
if (by > bz && by > bB) {
container_height = by
}
else if (bz > by && bz > bB) {
container_height = bz
}
else {
container_height = bB
}
o.width(container_width).height(container_height);
r.css({
left : 0, top : U
}).animate({
opacity : ba.back_opac
}, 0).find('img').animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, 0).siblings('span:visible').css(br).children('h6:visible').css({
'font-size' : S
});
s.css({
left : Y + 'px', top : M, 'z-index' : 2
}).animate({
opacity : ba.behind_opac
}, 0).find('img').animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, 0).siblings('span:visible').css(bq).children('h6:visible').css({
'font-size' : K
});
t.css({
left : Z + 'px', top : E, 'z-index' : 3
}).animate({
opacity : 1
}, 0).find('a *').css({
cursor : 'pointer'
}).end().find('img').animate({
width : front_img_width + 'px', height : front_img_height + 'px', margin : F + 'px', opacity : 1
}, 0).siblings('span:visible').css(bp).children('h6:visible').css({
'font-size' : C
});
u.css({
left : bb + 'px', top : M, 'z-index' : 2
}).animate({
opacity : ba.behind_opac
}, 0).find('img').animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, 0).siblings('span:visible').css(bq).children('h6:visible').css({
'font-size' : K
});
v.css({
left : bc + 'px', top : U
}).animate({
opacity : ba.back_opac
}, 0).find('img').animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, 0).siblings('span:visible').css(br).children('h6:visible').css({
'font-size' : S
});
if (n)
{
$('span:visible', w).css(bx);
$('span:visible', y).css(bw);
$('span:visible', z).css(bv)
}
function stopInterval()
{
if (c) {
clearInterval(c);
c = false;
}
}
function startInterval()
{
if (c) {
stopInterval()
}
c = setInterval("$('#" + h + "').click()", ba.autointerval)
}
function moveRight(b)
{
j = true;
eazing = '';
zpeed = ba.speed;
if (easingplugin)
{
if (b == 'twice') {
eazing = ba.move_twice_easein;
zpeed = Math.round(ba.speed * 0.5)
}
else if (b == 'twice_end') {
eazing = ba.move_twice_easeout
}
else {
eazing = ba.easing;
}
}
if (ba.autoplay) {
stopInterval()
}
if (k == (l - 2)) {
next = 1
}
else if (k == (l - 1)) {
next = 2;
if (next > l) {
next = 1;
}
}
else if (k == l) {
next = 3;
if (next > l) {
next = 1;
}
}
else {
next = (k + 3)
}
$('#' + e).removeAttr('id', '').addClass('remove').css('z-index', - 1);
$newitem1 = $('#' + f);
$newitem1.attr('id', e).stop().animate({
opacity : ba.back_opac, left : 0, top : U
}, zpeed, eazing).find('img').stop().animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : S
}, zpeed, eazing);
if (n) {
$newitem1.find('span:visible').stop().animate(bx, zpeed, eazing)
}
else {
$newitem1.find('span').stop().animate(br, zpeed, eazing)
}
setTimeout(function ()
{
$newitem1.css('z-index', 1)
},
(zpeed / 4));
$newitem2 = $('#' + g);
$newitem2.attr('id', f).stop().animate({
opacity : ba.behind_opac, left : Y + 'px', top : M
}, zpeed, eazing).find('img').stop().animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : K
}, zpeed, eazing);
if (n) {
$newitem2.find('span:visible').stop().animate(bw, zpeed, eazing)
}
else {
$newitem2.find('span').stop().animate(bq, zpeed, eazing)
}
setTimeout(function ()
{
$newitem2.css('z-index', 2)
},
(zpeed / 4));
$newitem3 = $('#' + h);
$newitem3.attr('id', g).stop().animate({
opacity : 1, left : Z + 'px', top : E
}, zpeed, eazing).find('img').stop().animate({
width : front_img_width + 'px', height : front_img_height + 'px', margin : F + 'px',
opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : C
}, zpeed, eazing);
if (n) {
$newitem3.find('span:visible').stop().animate(bv, zpeed, eazing)
}
else {
$newitem3.find('span').stop().animate(bp, zpeed, eazing)
}
setTimeout(function ()
{
$newitem3.css('z-index', 3)
},
(zpeed / 4));
$newitem4 = $('#' + i);
$newitem4.attr('id', h).stop().animate({
opacity : ba.behind_opac, left : bb + 'px', top : M
}, zpeed, eazing).find('img').stop().animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : K
}, zpeed, eazing);
if (n) {
$newitem4.find('span:visible').stop().animate(bw, zpeed, eazing)
}
else {
$newitem4.find('span').stop().animate(bq, zpeed, eazing)
}
setTimeout(function ()
{
$newitem4.css('z-index', 2)
},
(zpeed / 4));
q[next].clone().attr('id', i).prependTo(o).show().animate({
opacity : 0, left : bc + 'px', top : U
}, 0).animate({
opacity : ba.back_opac
},
zpeed, function ()
{
$('#' + f + ' a *').css({
cursor : 'default'
});
if (ba.autoplay) {
startInterval()
}
if (b == 'twice') {
moveRight('twice_end')
}
else {
$('#' + g + ' a *').css({
cursor : 'pointer'
})
}
if (!$('#' + g).is(":animated"))
{
j = false;
$('.remove').stop().fadeOut(zpeed, function ()
{
$(this).remove()
});
if (typeof move_callback == 'function')
{
var a = $('#' + g).find('a').attr('href');
if (a != undefined && a != '') {
move_callback(a)
}
}
}
}).find('img').animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, 0).end().find('h6:visible').css({
'font-size' : S
});
if (n) {
$('#' + i).find('span:visible').animate(bx, 0)
}
else {
$('#' + i).find('span').animate(br, 0)
}
$('.remove').fadeOut(zpeed, function ()
{
$(this).remove()
});
if (k == l) {
k = 1
}
else {
k = (k + 1)
}
}
function moveLeft(b)
{
j = true;
eazing = '';
zpeed = ba.speed;
if (easingplugin)
{
if (b == 'twice') {
eazing = ba.move_twice_easein;
zpeed = Math.round(ba.speed * 0.5)
}
else if (b == 'twice_end') {
eazing = ba.move_twice_easeout
}
else {
eazing = ba.easing;
}
}
if (ba.autoplay) {
stopInterval()
}
if (k == 3) {
next = l
}
else if (k == 2) {
next = (l - 1);
if (next < 1) {
next = l;
}
}
else if (k == 1) {
next = (l - 2);
if (next < 1) {
next = l;
}
}
else {
next = (k - 3)
}
$('#' + i).removeAttr('id').addClass('remove').css('z-index', - 1);
$newitem5 = $('#' + h);
$newitem5.attr('id', i).stop().animate({
opacity : ba.back_opac, left : bc + 'px', top : U
}, zpeed, eazing).find('img').stop().animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : S
}, zpeed, eazing);
if (n) {
$newitem5.find('span:visible').stop().animate(bx, zpeed, eazing)
}
else {
$newitem5.find('span').stop().animate(br, zpeed, eazing)
}
setTimeout(function ()
{
$newitem5.css('z-index', 1)
},
(zpeed / 4));
$newitem4 = $('#' + g);
$newitem4.attr('id', h).stop().animate({
opacity : ba.behind_opac, left : bb + 'px', top : M
}, zpeed, eazing).find('img').stop().animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : K
}, zpeed, eazing);
if (n) {
$newitem4.find('span:visible').stop().animate(bw, zpeed, eazing)
}
else {
$newitem4.find('span').stop().animate(bq, zpeed, eazing)
}
setTimeout(function ()
{
$newitem4.css('z-index', 2)
},
(zpeed / 4));
$newitem3 = $('#' + f);
$newitem3.attr('id', g).stop().animate({
opacity : 1, left : Z + 'px', top : E
}, zpeed, eazing).find('img').stop().animate({
width : front_img_width + 'px', height : front_img_height + 'px', margin : F + 'px',
opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : C
}, zpeed, eazing);
if (n) {
$newitem3.find('span:visible').stop().animate(bv, zpeed, eazing)
}
else {
$newitem3.find('span').stop().animate(bp, zpeed, eazing)
}
setTimeout(function ()
{
$newitem3.css('z-index', 3)
},
(zpeed / 4));
$newitem2 = $('#' + e);
$newitem2.attr('id', f).stop().animate({
opacity : ba.behind_opac, left : Y + 'px', top : M
}, zpeed, eazing).find('img').stop().animate({
width : I + 'px', height : J + 'px', margin : N + 'px', opacity : 1
}, zpeed, eazing).end().find('h6:visible').stop().animate({
'font-size' : K
}, zpeed, eazing);
if (n) {
$newitem2.find('span:visible').stop().animate(bw, zpeed, eazing)
}
else {
$newitem2.find('span').stop().animate(bq, zpeed, eazing)
}
setTimeout(function ()
{
$newitem2.css('z-index', 2)
},
(zpeed / 4));
q[next].clone().attr('id', e).prependTo(o).show().animate({
opacity : 0, left : 0, top : U
}, 0).animate({
opacity : ba.back_opac
},
zpeed, function ()
{
$('#' + h + ' a *').css({
cursor : 'default'
});
if (ba.autoplay) {
startInterval()
}
if (b == 'twice') {
moveLeft('twice_end')
}
else {
$('#' + g + ' a *').css({
cursor : 'pointer'
})
}
if (!$('#' + g).is(":animated"))
{
j = false;
$('.remove').stop().fadeOut(zpeed, function ()
{
$(this).remove()
});
if (typeof move_callback == 'function')
{
var a = $('#' + g).find('a').attr('href');
if (a != undefined && a != '') {
move_callback(a)
}
}
}
}).find('img').animate({
width : Q + 'px', height : R + 'px', margin : V + 'px', opacity : 1
}, 0).end().find('h6:visible').css({
'font-size' : S
});
if (n) {
$('#' + e).find('span:visible').animate(bx, 0)
}
else {
$('#' + e).find('span').animate(br, 0)
}
$('.remove').fadeOut(zpeed, function ()
{
$(this).remove()
});
if (k == 1) {
k = l
}
else {
k = (k - 1)
}
}
window[d + '_ext_prev'] = Function('', '$("#' + f + '").click();');
window[d + '_ext_next'] = Function('', '$("#' + h + '").click();');
$('#' + e).live('click', function ()
{
if (ba.freescroll || !j) {
moveLeft('twice')
}
});
$('#' + f).live('click', function ()
{
if (ba.freescroll || !j) {
moveLeft()
}
});
$('#' + h).live('click', function ()
{
if (ba.freescroll || !j) {
moveRight()
}
});
$('#' + i).live('click', function ()
{
if (ba.freescroll || !j) {
moveRight('twice')
}
});
$('#' + g).live('hover', function (a)
{
if (a.type == 'mouseover' && !j)
{
if (ba.autoplay) {
stopInterval()
}
$(this).addClass('zoomed').stop(true, true).animate(
{
left : '-=' + (front_img_width * (ba.hovergrowth / 2)) + 'px', top : '-=' + (front_img_height * ba.hovergrowth) + 'px'
}, hoverspeed).find('img').stop().animate(
{
width : (front_img_width * (1 + ba.hovergrowth)) + 'px', height : (front_img_height * (1 + ba.hovergrowth)) + 'px'
}, hoverspeed);
$('#' + f).stop(true, true).animate({
left : '-=' + (I * ba.hovergrowth) + 'px'
}, hoverspeed);
$('#' + h).stop(true, true).animate({
left : '+=' + (I * ba.hovergrowth) + 'px'
}, hoverspeed);
if (n)
{
iegrow = Math.round(ba.hovergrowth * front_img_width);
$(this).find('span:visible').animate({
width : '+=' + iegrow
}, hoverspeed)
}
}
else if (!j)
{
if (ba.autoplay) {
startInterval()
}
$(this).stop().animate({
left : Z + 'px', top : E
}, hoverspeed).find('img').stop().animate({
width : front_img_width + 'px', height : front_img_height + 'px'
},
hoverspeed, function ()
{
$('#' + g).removeClass('zoomed')
});
$('#' + f).stop().animate({
left : Y
}, hoverspeed);
$('#' + h).stop().animate({
left : bb
}, hoverspeed);
if (n)
{
iegrow = Math.round(ba.hovergrowth * front_img_width);
o.find('.zoomed span:visible').animate({
width : '-=' + iegrow
}, hoverspeed)
}
}
});
if (!m) {
$('#' + g + ':not(.zoomed)').live('mousemove', function ()
{
$('#' + g).mouseover()
})
}
$('#' + e + ' a, #' + f + ' a, #' + h + ' a, #' + i + ' a').live('click', function (a)
{
a.preventDefault()
});
$('#' + g + ' a').live('click', function ()
{
if (typeof link_callback == 'function')
{
link_callback($(this).attr('href'))
}
});
$(document).keydown(function (a)
{
if (a.keyCode == 13) {
$('#' + h).click()
}
if (a.keyCode == 32) {
// a.preventDefault();
$('#' + h).click()
}
if (a.keyCode == 37) {
// a.preventDefault();
$('#' + f).click()
}
if (a.keyCode == 39) {
// a.preventDefault();
$('#' + h).click()
}
});
//마우스 휠
$('#rolling').bind('mousewheel',this,function(event,delta) {
if(delta > 0) {
$('#' + h).click();
}
else if(delta < 0) {
$('#' + f).click()
}
return false;
});
if (ba.autoplay) {
startInterval()
}
})
}
})(jQuery);