[해피CGI][cgimall] 필터를이용한 롤오버효과

<B>1. 불투명도를 조정한 롤오버 예제</B><br>
<a href="#" onMouseOut="menu01.style.filter='alpha(opacity=50)';" onMouseOver="menu01.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick1.jpg" width="100" height="70" name="menu01" border="0" STYLE='filter:alpha(opacity=50);'></a>

-style filter를 이용한 태그입니다 A링크에 onMouseOut에 name값을 입력해주신다음 filter에  opacity값을 입력해줍니다.

<a href="#" onMouseOut="menu02.style.filter='alpha(opacity=50)';" onMouseOver="menu02.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick2.jpg" width="100" height="70" name="menu02" border="0" STYLE='filter:alpha(opacity=50);'></a>
<a href="#" onMouseOut="menu03.style.filter='alpha(opacity=50)';" onMouseOver="menu03.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick3.jpg" width="100" height="70" name="menu03" border="0" STYLE='filter:alpha(opacity=50);'></a>
<p>

<B>2. 롤오버시 흑백->칼라로 전환</B><br>
<a href="#" onMouseOut="menu04.style.filter='gray';" onMouseOver="menu04.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick4.jpg" width="100" height="70" name="menu04" border="0" STYLE='filter:gray();'></a>
<a href="#" onMouseOut="menu05.style.filter='gray';" onMouseOver="menu05.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick5.jpg" width="100" height="70" name="menu05" border="0" STYLE='filter:gray();'></a>
<a href="#" onMouseOut="menu06.style.filter='gray';" onMouseOver="menu06.style.filter = 'none';"><img src="http://demo.happycgi.com/jini/pick6.jpg" width="100" height="70" name="menu06" border="0" STYLE='filter:gray();'></a>
<p>

<B>3. 롤오버시 칼라->흑백으로 전환</B><br>
<a href="#" onMouseOut="menu07.style.filter='none';" onMouseOver="menu07.style.filter = 'gray';"><img src="http://demo.happycgi.com/jini/pick7.jpg" width="100" height="70" name="menu07" border="0" ></a>
<a href="#" onMouseOut="menu08.style.filter='none';" onMouseOver="menu08.style.filter = 'gray';"><img src="http://demo.happycgi.com/jini/pick8.jpg" width="100" height="70" name="menu08" border="0" ></a>
<a href="#" onMouseOut="menu09.style.filter='none';" onMouseOver="menu09.style.filter = 'gray';"><img src="http://demo.happycgi.com/jini/pick9.jpg" width="100" height="70" name="menu09" border="0" ></a>


각각의 예제들은 모두 응용한것임으로 한번쯤 사용해보시고 적용시켜 보시길 바랍니다.