오늘본상품 없을때 이모티콘출력 및 애니효과주기

Tip & Tech

활용팁

홈 > 회원포럼 > 활용팁
활용팁

오늘본상품 없을때 이모티콘출력 및 애니효과주기

4 청산 3 97 1 0

오늘본상품이 없을때 기본출력 "없음" 대신 이모티콘 출력하고 심심하면 애니메이션 효과주기

애니메이션 효과는 나눔샵님 팁을 이용

http://amina.co.kr/bbs/board.php?bo_table=tip&wr_id=5324 


1. thema>basic>widget>basic-wing-right>widget.php

<?php } else { // 오늘 본 상품이 없을 때 ?>

<!-- <p>없음</p> -->

<img class="icon-animated-vertical" src="<?php echo G5_URL;?>/img/emoticon/원하는.gif" align="center">


2. 같은 디렉토리의 widget.css 마지막에

.icon-animated-vertical{display:inline-block;text-align:center;margin-left:16px;padding:8px 0;-moz-animation:vertical 1.5s 9999 ease 2s;-webkit-animation:vertical 1.5s 9999 ease 2s;-o-animation:vertical 1.5s 9999 ease 2s;-ms-animation:vertical 1.5s 9999 ease 2s;

animation:vertical 1.5s 9999 ease 2s}@-moz-keyframes vertical{0%{-moz-transform:translate(0,-5px)}4%{-moz-transform:translate(0,5px)}8%{-moz-transform:translate(0,-5px)}12%{-moz-transform:translate(0,3px)}16%{-moz-transform:translate(0,-5px)}20%{-moz-transform:translate(0,5px)}22%{-moz-transform:translate(0,0)}}@-webkit-keyframes vertical{0%{-webkit-transform:translate(0,-5px)}4%{-webkit-transform:translate(0,3px)}8%{-webkit-transform:translate(0,-5px)}12%{-webkit-transform:translate(0,5px)}16%{-webkit-transform:translate(0,-5px)}20%{-webkit-transform:translate(0,3px)}22%{-webkit-transform:translate(0,0)}}@-ms-keyframes vertical{0%{-ms-transform:translate(0,-5px)}4%{-ms-transform:translate(0,5px)}8%{-ms-transform:translate(0,-5px)}12%{-ms-transform:translate(0,5px)}16%{-ms-transform:translate(0,-5px)}20%{-ms-transform:translate(0,5px)}22%{-ms-transform:translate(0,0)}}@keyframes vertical{0%{transform:translate(0,-5px)}4%{transform:translate(0,5px)}8%{transform:translate(0,-5px)}12%{transform:translate(0,5px)}16%{transform:translate(0,-5px)}20%{transform:translate(0,5px)}22%{transform:translate(0,0)}}


추가해줍니다. 무한재생 9999 (5군데)를 재생원하는 횟수로 변경가능. (예, 2로 변경하면 2회만 재생합니다) 



3 Comments
11 우성짱 10.01 08:25  
추천합니다
4 청산 10.01 21:30  
감사합니다. 즐거운 추석연휴 보내십시요.
1 사스가 10.17 04:14  
많이 배우고 가네요
제목
최근 글
최근 댓글
Facebook Twitter GooglePlus KakaoStory KakaoTalk NaverBand