Nokia N8 Touchscreen Phone Beyaz - gps navigation, Voice Navigation, 12 MP Camera
Coby MP305-2G MP3 Player
Apple iPod shuffle 1 GB Gumus
Canon Digital Rebel XSi 12.2 MP Digital SLR Camera with EF-S 18-55mm f/3.5-5.6 IS Lens (Black)
:: HOME HTML IE Filters
IE Filters

I want to mention about a useful tools which you can just use with internet explorer. filters help you to apply a special effects to an object or page to change its appearance. The bad thing is that it works just with internet explorer. You can use filters just with div and span elements, inline images, form elements and table elements.


Below i show 2 examples and you can also check this script to create filter for what you want.

Click Here To View IE Filter Script

For example, When you want to roll-over menu like when you move your mouse over it, it changes its color or whatever. For that, you need to use JavaScript if it is image. But with iie filters, you can make it with simple way.


<img src="ourimage.jpg"  onMouseOver="'Alpha(Opacity=90, FinishOpacity=50, Style=4, StartX=100, StartY=100, FinishX=100, FinishY=0); ';" onMouseOut="'';">


Just try this example and see the differences.

Also you can see some navigation that when you move your mouse over it, it pulls down slowly. You can do that with extra JavaScript code or you can use ie filters for like:


<style type="text/CSS">
    .Menu {visibility: hidden}
    .menuMOver {visibility: hidden}
    .Menu {filter:progid:DXImageTransform.Microsoft.DropShadow(color=#999999, offX=0, offY=0)
                progid:DXImageTransform.Microsoft.Blinds(direction=down, bands=1)}
<script type="text/JavaScript">
    var ActiveMenu = null;
    var ActMenu = null;
    function hideActive() {
        if(ActiveMenu!== null) {
            ActiveMenu = null;
    function popMenu(M) {
        ActiveMenu = document.getElementById(M);
        if(ActiveMenu.filters) ActiveMenu.filters[1].apply();
        if(ActiveMenu.filters) ActiveMenu.filters[1].play(0.5);
    function hideIt(object) {"hidden";
    function showIt(object) {"visible";
    function hideObj(div) {
        document.getElementById(div).style.visibility = "hidden";

<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onClick="hideActive();">
<div id="myMenu" class="Menu">
   <a href="1.HTML">1</a>
   <a href="2.HTML">2</a>

       <div class="menuDiv">
            <div class="menuCol" onMouseOver="popMenu('myMenu');"><a href="#">LINK</a></div>