js 售磬效果

html 代码

  <a href="{$goods.url}" class="img" id="covers">
                            <img  src="{$goods.goods_thumb}" alt="" id="imgChangeCol">
                            </a>

js

	$(function(){
	var s="<div class='mask_layer_tip'><div id='scs_alert'>"+"<img src='themes/higou/images/saled.png'>"+"</div></div>";
		$("#covers").append(s); 
		$("#imgChangeCol").addClass("changeCol");
    });

css

 .mask_layer_tip{
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=50)";  
	filter: alpha(opacity=50);  
	-moz-opacity: 0.5;  
	-khtml-opacity: 0.5;  
	opacity: 0.5; 
	z-index:1000;
	position:absolute;
	_position:absolute; /*IE6*/
	top:0;left:0;
	width:100%;height:100%;	
   }
  #scs_alert{
  position: absolute;
  _position: absolute;
  z-index: 1001;
  text-align: center;
   bottom: 10px;
  right: 10px;
}
#scs_alert img{
	width:100%;
}
.changeCol{
	
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}