توضیح: حتما در خیلی از سایت ها دیدید که تمام تصاویر یکجوری کم رنگ هستند و وقتی با موس روی آنها میرویم از حالت کم رنگی در میآیند. به این نوع افکت ها میگن افکت شفافیت. شما هم در ادامه می توانید یک چیزی همانند آنها خلق کنید.
کد زیر را در main.tpl بین تگ و قرار دهید:
<style type="text/css">
<!--
#banners a img {
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
#banners a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
-->
</style>
<!--
#banners a img {
opacity:0.3; -moz-opacity:0.3; filter:alpha(opacity=40);
}
#banners a:hover img {
opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100);
}
-->
</style>
حالا نیاز به یک کدی داریم که تصاویرمون رو در آن قرار دهیم:
<div id="banners">
<a href="#"><img src="cnt.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="cycounter.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="hit.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="img.gif" width="88" height="31" border="0"</a>
</div>
<a href="#"><img src="cnt.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="cycounter.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="hit.gif" width="88" height="31" border="0"></a>
<a href="#"><img src="img.gif" width="88" height="31" border="0"</a>
</div>
شما از این کد می توانید در هر جا که مایل باشید استفاده کنید. حتی با کمی دستکاری در فایل style.css قالبتون می توانید کاری کنید هر تصویری که در سایتتون هست به این شکل دربیایند.
