スポンサーサイト

一定期間更新がないため広告を表示しています

| スポンサードリンク | - | - | pookmark |
Entry: main  << >>
画像のズーム機能(stella_shop)
stella_shop」に施しているAmazon画像拡大のカスタマイズメモ。

<!-- BEGIN amazon -->
<div id="my_amazon_card">

<a href="{amazon_url}" target="_blank">

<img border="0" src="{amazon_ImageUrlMedium}" alt="{amazon_ProductName}" class="small_pic" width="95px" height="110px" />

<img border="0" src="{amazon_ImageUrlLarge}" alt="{amazon_ProductName}" class="large_pic" width="150px" height="185px" />

</a>

</div>
<!-- END amazon -->

/*画像の拡大表示*/
#my_amazon_card a:link img.large_pic { display:none; border-style:none;}
#my_amazon_card a:visited img.large_pic { display:none; border-style:none;}
#my_amazon_card a:active img.large_pic { display:none; border-style:none;}
#my_amazon_card img.large_pic { display:none; border-style:none;}
#my_amazon_card a:hover{background-color:transparent;}
#my_amazon_card a:hover img.large_pic{
border: 2px solid #dadada;
display:block;
}
#my_amazon_card a:link img.small_pic{ border-style:none; display:block;}
#my_amazon_card a:visited img.small_pic { border-style:none; display:block;}
#my_amazon_card a:active img.small_pic { border-style:none; display:block;}
#my_amazon_card a:focus img.large_pic { border-style:none; display:block;}
#my_amazon_card a:hover img.small_pic {
border-style:none;
display:none;
}
.amazon_text {display:none;}



| pika | - | - | pookmark |
スポンサーサイト
| スポンサードリンク | - | - | pookmark |