인벤 스크립트에 관심을 가져주셔서 감사합니다.
문의하신 "마우스를 올렸을 때는 움직이는 이미지, 평상시에는 정지 이미지를 보여주는 버튼" 소스를 전달 드립니다.
정지 이미지를 배경화면에 깔고, 움직이는 이미지의 투명도를 100%~0%로 조절하면서 마우스를 올리면 움직이는 것 처럼 보이도록 구현하였습니다.
혹시 원하시던 형태와 다르거나, 이외에도 궁금하신 점은 언제든지 글 남겨주세요.
감사합니다.
■ HTML을 누른 상태에서 붙여넣어 주세요.
<div data-inven-tabs="">
<span data-inven-tab-for="tab_1" style="background:url(https://upload2.inven.co.kr/upload/2017/09/16/bbs/i15425189942.png) 0 0/100%;margin-right:2px;display:inline-block;">
<img src="https://upload2.inven.co.kr/upload/2017/09/16/bbs/i13905860692.gif" style="width:147px;opacity:0;transition:0.3s;" data-inven-out-css="{'_SELF_':{'opacity':'0'}}" data-inven-over-css="{'_SELF_':{'opacity':'1'}}">
</span>
<span data-inven-tab-for="tab_2" style="background:url(https://upload2.inven.co.kr/upload/2017/09/16/bbs/i15455379410.png) 0 0/100%;margin-right:2px;display:inline-block;">
<img src="https://upload2.inven.co.kr/upload/2017/09/16/bbs/i13952931535.gif" style="width:147px;opacity:0;transition:0.3s;" data-inven-out-css="{'_SELF_':{'opacity':'0'}}" data-inven-over-css="{'_SELF_':{'opacity':'1'}}">
</span>
<span data-inven-tab-for="tab_3" style="background:url(https://upload2.inven.co.kr/upload/2017/09/16/bbs/i15488432787.png) 0 0/100%;margin-right:2px;display:inline-block;">
<img src="https://upload2.inven.co.kr/upload/2017/09/16/bbs/i13217245275.gif" style="width:147px;opacity:0;transition:0.3s;" data-inven-out-css="{'_SELF_':{'opacity':'0'}}" data-inven-over-css="{'_SELF_':{'opacity':'1'}}">
</span>