http://www.inven.co.kr/board/powerbbs.php?come_idx=4712&name=nicname&keyword=Nacx&l=184
이 게시물을 보고 썸네일과 클릭시 이미지 출력을 테스트하고 있는데요.
알못이라 자꾸 막히는데...ㅠㅠ 응용이 너무 어려워서 여쭈어 봅니다.
1. 클릭하지 않았을 때,일단 '처음 이미지'를 보여주려면 어떻게 해야할까요? 클릭 전엔 하얀 빈칸이어서요. ㅠㅠ
2. 클릭이 아니라, '마우스 오버'만으로 이미지를 출력할 수는 없을까요?
3. 아래 빈 칸을 '고정적인' 가로세로 길이가 아니라, '이미지 크기'에 맞춰 바꿀 수는 없는건가요?
예를 들면, 현재 제 인장의 3번째 이미지는 세로로 긴 것을 넣어봤는데요.
고정적인 빈칸 사이즈 때문에 긴 이미지를 넣으면 아랫부분이 잘려버립니다.
그렇다고 그냥 이미지를 생각없이 넣어버리면 빈 칸에 강제로 맞춰져서 이미지가 햄버거처럼 짜부짜부 돼버리고..ㅠㅠ
즉,
빈 칸 사이즈에 이미지를 맞추는것이 아닌,
이미지 사이즈에 빈 칸이 맞추려면 어떻게 해야할까요?
아니면 다 필요없고, 이미지에 맞춰진 칸 테두리 필요없으니ㅠㅠ...
그냥 썸넬 클릭시 이미지만 제대로 보여지기만 하면 좋겠습니다...
멋대로 뭘지우면 난리가 나서 도저히 못하겠어요 ㅠㅠ
일단 제 소스를 올립니다...=============================================================================
<div><br /></div><div data-inven-action="search-profile,last-attack-10,last-attack-all"> <span data-inven-attr-for="button" style="color:#ffffff; background-color:pink;" data-inven-over-css="{'_SELF_':{'color':'#000000','backgroundColor':'#ffffff' }}" data-inven-out-css="{'_SELF_':{'color':'#ffffff','backgroundColor':'pink' }}"> </span></div><div><br /></div>
<br />인장 테스트중
<br /><br />
<a href="#" data-inven-click-css="{'ev-click-img':{'background':'url(https://upload2.inven.co.kr/upload/2016/03/10/bbs/i12837424190.png)', 'background-repeat':'no-repeat', 'background-size':'440px 308px'}}"><img style="max-width:50px; max-height:50px;" src="https://upload2.inven.co.kr/upload/2016/03/10/bbs/i12837424190.png"></a>
<a href="#" data-inven-click-css="{'ev-click-img':{'background':'url(https://upload2.inven.co.kr/upload/2016/02/23/bbs/i11512676706.gif)', 'background-repeat':'no-repeat', 'background-size':'449px 253px'}}"><img style="max-width:50px; max-height:50px;" src="https://upload2.inven.co.kr/upload/2016/02/23/bbs/i11512676706.gif"></a>
<a href="#" data-inven-click-css="{'ev-click-img':{'background':'url(https://upload2.inven.co.kr/upload/2015/10/29/bbs/i13552162676.png)', 'background-repeat':'no-repeat', 'background-size':'433px 641px'}}"><img style="max-width:50px; max-height:50px;" src="https://upload2.inven.co.kr/upload/2015/10/29/bbs/i13552162676.png"></a>
<br /><br />
<div data-inven-id="ev-click-img" style="border: 1px solid rgb(211, 178, 255);background-color: rgba(235, 245, 244, 1);width: 449px;height: 400px;"></div>