当鼠标在图像上突然移动时，如何阻止图像消失

在代码中，图标是图像，当您将鼠标快速移动到某些图标上时，这些图像往往会消失。这主要是因为我包含了降低悬停时图像亮度的过渡。但当鼠标在图像中快速移动时，它们会消失一秒钟，然后又回来。如何删除此错误？

header{
    	background:	#000;
    	color:#FFF;
    	text-align:center;
    	padding:30px; 
    	font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
    	font-size:25px;
    }
#iconwrap{float:left;}
    #icon{
    -webkit-transition: 0s -webkit-filter;
   	-webkit-transition-duration: .6s;	
    -webkit-transition-timing-function: cubic-bezier(0.175,0.885,0.320,1.275);
    
    -moz-transition: 0s -webkit-filter;
   	-moz-transition-duration: .6s;	
   	-moz-transition-timing-function: cubic-bezier(0.175,0.885,0.320,1.275);
    -o-transition: 0s -webkit-filter;
   	-o-transition-duration: .6s;	
   	-o-transition-timing-function: cubic-bezier(0.175,0.885,0.320,1.275);
    }
    #icon:hover{ 
    -webkit-filter: brightness(25%);
    -moz-filter: brightness(25%);
    -o-filter: brightness(25%);}

<header>
    Project-Mate
<nav>
    <div id="iconwrap">
        <img id="icon" src="http://www.easyicon.net/api/resize_png_new.php?id=548873&size=48" />
    	<img id="icon" src="http://www.easyicon.net/api/resize_png_new.php?id=548873&size=48" />
    	<img id="icon" src="http://www.easyicon.net/api/resize_png_new.php?id=548873&size=48" />
    	<img id="icon" src="http://www.easyicon.net/api/resize_png_new.php?id=548873&size=48" />
    	<img id="icon" src="http://www.easyicon.net/api/resize_png_new.php?id=548873&size=48" />
    </div>
</nav>   
<header>