남은시간 표시하기 정보
남은시간 표시하기관련링크
http://bikedb.co.kr
517회 연결
본문
소셜쇼핑 등에 있는 남은시간 표시하기
http://keith-wood.name/countdownBasics.html
item.form.skin.php 파일에 추가
<!-- 남은 시간 { -->
<script src="<?php echo G5_JS_URL; ?>/jquery.plugin.js"></script>
<script src="<?php echo G5_JS_URL; ?>/jquery.countdown.js"></script>
<!-- } 남은 시간 -->
<?
// 종료시간 - Ex) 3월 24일 오후 2시
$endtime = mktime('14','00','00','03','24','2014') ;
// 판매 가능하고 재고가 있으며 품절이 아닐때, 종료시간 전일때
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time()) ) {
// 남은 시간
$countdown = $endtime - time();
//echo $countdown;
?>
<div class="buy_time">
<!-- 마감 카운트다운 -->
<div class="time">
<span class="tit">남은 시간</span>
<div id="dealCountdown" class="count" style="background:none;"></div>
</div>
<script type="text/javascript">
$(document).ready(function() {
var d = <?php echo $countdown; ?>;
var layout ='<span class="date"><span>{dn}</span><span class="hide">일</span></span>';
layout +='<div>';
layout +=' <span>{hnn}</span>';
layout +=' <span class="hide">시간</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{mnn}</span>';
layout +=' <span class="hide">분</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{snn}</span>';
layout +=' <span class="hide">초</span>';
layout +='</div>';
$('#dealCountdown').countdown({until: d, format: 'dHMS', labels:['','','','','','',''],layout:layout});
});
</script>
</div>
<? } ?>
skin/shop/basic/style.css 에 아래 내용 추가
.buy_time{text-align:right;width:100%;height:25px;margin:5px 0}
.buy_time .time{background: url('./img/countdown.png') top right no-repeat;float:right;width:300px;height:25px;position:relative}
.buy_time .time .tit{float:right;height:25px;line-height:25px;color:#666;margin-right:160px;font-weight:bold}
.buy_time .time .count{float:right;position:absolute;top:0;right:10px;height:25px}
.buy_time .time .count span{color:#fff;font-size:14px;font-family:Tahoma;font-weight:bold;height:25px;line-height:25px}
.buy_time .time .count .date{width:18px;float:left;margin-right:23px;padding-left:3px;line-height:25px;height:25px;text-align:right}
.buy_time .time .count div{float:left;width:31px;text-align:right}
.hide {display:block;overflow:hidden;position:absolute;left:-9999px;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px}
skin/shop/basic/img 폴더에 첨부된 png 파일 업로드
js 파일은 아래 url 다운받아 js 폴더에 업로드
http://keith-wood.name/js/jquery.plugin.js
http://keith-wood.name/js/jquery.countdown.js
* 모바일도 동일하게 적용합니다. 영카트4에도 적용 가능, 내용만 좀 수정해서요.
http://keith-wood.name/countdownBasics.html
item.form.skin.php 파일에 추가
<!-- 남은 시간 { -->
<script src="<?php echo G5_JS_URL; ?>/jquery.plugin.js"></script>
<script src="<?php echo G5_JS_URL; ?>/jquery.countdown.js"></script>
<!-- } 남은 시간 -->
<?
// 종료시간 - Ex) 3월 24일 오후 2시
$endtime = mktime('14','00','00','03','24','2014') ;
// 판매 가능하고 재고가 있으며 품절이 아닐때, 종료시간 전일때
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time()) ) {
// 남은 시간
$countdown = $endtime - time();
//echo $countdown;
?>
<div class="buy_time">
<!-- 마감 카운트다운 -->
<div class="time">
<span class="tit">남은 시간</span>
<div id="dealCountdown" class="count" style="background:none;"></div>
</div>
<script type="text/javascript">
$(document).ready(function() {
var d = <?php echo $countdown; ?>;
var layout ='<span class="date"><span>{dn}</span><span class="hide">일</span></span>';
layout +='<div>';
layout +=' <span>{hnn}</span>';
layout +=' <span class="hide">시간</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{mnn}</span>';
layout +=' <span class="hide">분</span>';
layout +='</div>';
layout +='<div>';
layout +=' <span>{snn}</span>';
layout +=' <span class="hide">초</span>';
layout +='</div>';
$('#dealCountdown').countdown({until: d, format: 'dHMS', labels:['','','','','','',''],layout:layout});
});
</script>
</div>
<? } ?>
skin/shop/basic/style.css 에 아래 내용 추가
.buy_time{text-align:right;width:100%;height:25px;margin:5px 0}
.buy_time .time{background: url('./img/countdown.png') top right no-repeat;float:right;width:300px;height:25px;position:relative}
.buy_time .time .tit{float:right;height:25px;line-height:25px;color:#666;margin-right:160px;font-weight:bold}
.buy_time .time .count{float:right;position:absolute;top:0;right:10px;height:25px}
.buy_time .time .count span{color:#fff;font-size:14px;font-family:Tahoma;font-weight:bold;height:25px;line-height:25px}
.buy_time .time .count .date{width:18px;float:left;margin-right:23px;padding-left:3px;line-height:25px;height:25px;text-align:right}
.buy_time .time .count div{float:left;width:31px;text-align:right}
.hide {display:block;overflow:hidden;position:absolute;left:-9999px;width:1px;height:1px;font-size:0;line-height:0;text-indent:-9999px}
skin/shop/basic/img 폴더에 첨부된 png 파일 업로드
js 파일은 아래 url 다운받아 js 폴더에 업로드
http://keith-wood.name/js/jquery.plugin.js
http://keith-wood.name/js/jquery.countdown.js
* 모바일도 동일하게 적용합니다. 영카트4에도 적용 가능, 내용만 좀 수정해서요.
추천
9
9
댓글 15개
감사함니다
찾던겁니다. 감사합니다 ^^
정말 좋겠네요.
굿잡 입니다.^^
좋은 팁이네요 ^^
죄송합니다만...
==> skin/shop/basic/img 폴더에 첨부된 png 파일 업로드
이 png 파일이 첨부가 안된거 같습니다. ^^;
==> skin/shop/basic/img 폴더에 첨부된 png 파일 업로드
이 png 파일이 첨부가 안된거 같습니다. ^^;
위 내용중 검은 바탕의 이미지입니다. 소셜쇼핑 등에 있는 남은시간 표시하기 바로 위 이미지...
http://bikedb.co.kr/ver2/skin/shop/basic/img/countdown.png
http://bikedb.co.kr/ver2/skin/shop/basic/img/countdown.png
감사합니다.
좋아요~
유용한 자료 감사합니다.
$endtime 을 여분필드 만들어서
2015-12-30 12:59 라고 입력하면
$endtime 은 어떻게 적어야 하는건가요?
2015-12-30 12:59 라고 입력하면
$endtime 은 어떻게 적어야 하는건가요?
$endtime = mktime('12','59','00','12','30','2015') ;
답변감사드립니다.
여분필드를 이용할려고 하는건 각기 다른 시간들 때문에 그렇게 할려고 하거든요.
$endtime = it_1 이런식으로요.. 근데 잘 되질 않아서요.
여분필드를 이용할려고 하는건 각기 다른 시간들 때문에 그렇게 할려고 하거든요.
$endtime = it_1 이런식으로요.. 근데 잘 되질 않아서요.
// 판매 가능하고 재고가 있으며 품절이 아닐때, 종료시간 전일때
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time()) ) {
저는 이 라인에 구문 오류가 뜨네요..ㄷㄷ
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time()) ) {
저는 이 라인에 구문 오류가 뜨네요..ㄷㄷ
가로 ) 가 하나 더 있네여
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time() ) {
if ( $it[it_use] && !$it[it_soldout] && $it[it_stock_qty] > 0 && $endtime>time() ) {