애니메이션 스킨 jQuery 코드 변경

This commit is contained in:
chicpro
2013-08-07 17:48:49 +09:00
parent 4a9dd57d3a
commit 5b342d23f7
4 changed files with 224 additions and 149 deletions

View File

@ -11,14 +11,12 @@ if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
<!-- 상품유형 30 시작 { -->
<?php
$itemtype = $this->type;
for ($i=1; $row=sql_fetch_array($result); $i++) {
if ($i == 1) {
if ($this->css) {
echo "<ul id=\"smt_{$itemtype}\" class=\"{$this->css}\">\n";
echo "<ul id=\"smt_{$this->type}\" class=\"{$this->css}\">\n";
} else {
echo "<ul id=\"smt_{$itemtype}\" class=\"sct smt_30\">\n";
echo "<ul id=\"smt_{$this->type}\" class=\"sct smt_30\">\n";
}
echo "<li class=\"sct_li sct_li_first\">\n";
}
@ -82,61 +80,83 @@ if($i == 1) echo "<p class=\"sct_noitem\">등록된 상품이 없습니다.</p>\
?>
<script>
$(function() {
var $smt<?php echo $itemtype; ?> = $("#smt_<?php echo $itemtype; ?> li.sct_li");
var $smt<?php echo $itemtype; ?>_a = $("#smt_<?php echo $itemtype; ?> li.sct_li a");
var smt<?php echo $itemtype; ?>_width = $smt<?php echo $itemtype; ?>.width();
var smt<?php echo $itemtype; ?>_count = $smt<?php echo $itemtype; ?>.size();
var smt<?php echo $itemtype; ?>_c_idx = smt<?php echo $itemtype; ?>_o_idx = 0;
var smt<?php echo $itemtype; ?>_time = 7000;
var smt<?php echo $itemtype; ?>_a_time = 1500;
var smt<?php echo $itemtype; ?>_interval = null;
$.fn.leftRolling = function(option)
{
var $smt = this.find("li.sct_li");
var $smt_a = $smt.find("a");
var width = $smt.width();
var count = $smt.size();
var c_idx = smt_o_idx = 0;
var fx = null;
if(smt<?php echo $itemtype; ?>_count > 1)
smt<?php echo $itemtype; ?>_interval = setInterval(left_rolling, smt<?php echo $itemtype; ?>_time);
// 기본 설정값
var settings = $.extend({
interval: 7000,
duration: 1500
}, option);
$smt<?php echo $itemtype; ?>.hover(
if(count < 2)
return;
fx = setInterval(left_rolling, settings.interval);
$smt.hover(
function() {
if(smt<?php echo $itemtype; ?>_interval != null)
clearInterval(smt<?php echo $itemtype; ?>_interval);
if(fx != null)
clearInterval(fx);
},
function() {
if(smt<?php echo $itemtype; ?>_interval != null)
clearInterval(smt<?php echo $itemtype; ?>_interval);
if(fx != null)
clearInterval(fx);
if(smt<?php echo $itemtype; ?>_count > 1)
smt<?php echo $itemtype; ?>_interval = setInterval(left_rolling, smt<?php echo $itemtype; ?>_time);
if(count > 1)
fx = setInterval(left_rolling, settings.interval);
}
);
$smt<?php echo $itemtype; ?>_a.on("focusin", function() {
if(smt<?php echo $itemtype; ?>_interval != null)
clearInterval(smt<?php echo $itemtype; ?>_interval);
$smt_a.on("focusin", function() {
if(smt_interval != null)
clearInterval(smt_interval);
});
$smt<?php echo $itemtype; ?>_a.on("focusout", function() {
if(smt<?php echo $itemtype; ?>_interval != null)
clearInterval(smt<?php echo $itemtype; ?>_interval);
$smt_a.on("focusout", function() {
if(fx != null)
clearInterval(fx);
if(smt<?php echo $itemtype; ?>_count > 1)
smt<?php echo $itemtype; ?>_interval = setInterval(left_rolling, smt<?php echo $itemtype; ?>_time);
if(count > 1)
fx = setInterval(left_rolling, settings.interval);
});
function left_rolling() {
$smt<?php echo $itemtype; ?>.eq(smt<?php echo $itemtype; ?>_o_idx).animate(
{ left: "-="+smt<?php echo $itemtype; ?>_width+"px" }, smt<?php echo $itemtype; ?>_a_time
$smt.each(function(index) {
if($(this).is(":visible")) {
o_idx = index;
return false;
}
});
$smt.eq(o_idx).animate(
{ left: "-="+width+"px" }, settings.duration,
function() {
$(this).css("display", "none").css("left", width+"px");
}
);
smt<?php echo $itemtype; ?>_c_idx = (smt<?php echo $itemtype; ?>_o_idx + 1) % smt<?php echo $itemtype; ?>_count;
c_idx = (o_idx + 1) % count;
$smt<?php echo $itemtype; ?>.eq(smt<?php echo $itemtype; ?>_c_idx).css("display", "block").animate(
{ left: "-="+smt<?php echo $itemtype; ?>_width+"px" }, smt<?php echo $itemtype; ?>_a_time,
$smt.eq(c_idx).css("display", "block").animate(
{ left: "-="+width+"px" }, settings.duration,
function() {
$smt<?php echo $itemtype; ?>.eq(smt<?php echo $itemtype; ?>_o_idx).css("display", "none").css("left", smt<?php echo $itemtype; ?>_width+"px");
smt<?php echo $itemtype; ?>_o_idx = smt<?php echo $itemtype; ?>_c_idx;
o_idx = c_idx;
}
);
}
}
$(function() {
$("#smt_<?php echo $this->type; ?>").leftRolling();
// 기본 설정값을 변경하려면 아래처럼 사용
//$("#smt_<?php echo $this->type; ?>").leftRolling({ interval: 7000, duration: 1500 });
});
</script>
<!-- } 상품진열 30 끝 -->