How to use
$ (function () {Setfloatbackgroundbyid ("Adplay");});
$ (window). Resize (function () {Setfloatbackgroundbyid ("Adplay");});
functionSetfloatbackgroundbyid (ID) {
Var$objId =$("#" +id);//The ID of the whole large picture
$objId.CSS ({"Overflow":"Hidden","Position":"Relative"});
Var$html =$("<div class=\"Flow\"style=\"Width: "+$objId. Width () +"Px;height:" +$objId. Height () +"Px;left:0;top:0;display:none;position:absolute;opacity:0.5;z-index:1\"> ");
$objId.Children ().eachfunction () {//To prevent append from being repeatedly added
if (!$objId.Is (': Has (". Flow")) {
$objId.Append$html);
}
})
Var$MAINIMG =$objId.css"Background-image"); Get the URL address of a large map
Var$divEach =$("Div",$OBJID).Not". Flow");
$divEach.CSS ({"Position":"Absolute","Overflow":"Hidden","Z-index":"100"});
$divEach.eachfunction () {
Var$this =$(this);
$(This).CSS ({"Left":parseint ($this.attr"Top") +"PX","Top":parseint ($this.attr"Left") +"px"});
$(This).Hoverfunction () {
Vartop=parseint ($(This).css"Top") +"PX"; Positioning
Varleft=parseint ($(This).css"Left") +"PX";
Var$IMG =$MAINIMG +" -" +Top +" -" +Left Note that there must be a space in front of top and left before the display fails
$this. CSS ("Background", "none");
$html. $this. CSS ({ "background": $Img});
},function () {
$html. css ( $divEach. CSS ( "background", "none");
})
})
}
/span> < Span style= "COLOR: #458383" >< Span style= "COLOR: #458383" > < Span style= "COLOR: #008000" > Below is the HTML code
<div style= "width:960px; height:508px; Background:url (pic/swhw.jpg); Overflow:hidden; "id=" Swimgbox ">
<a href= "http://www.fsmjj.com/Product/Furniture/0a714b5c22144620815afc82b6069be0.shtml" target= "_blank" >
<div style= "width:190px; height:160px, "top=" 0 "left=" 0 ">
</div>
</a><a href= "http://www.fsmjj.com/Product/Furniture/18ea613c68af47ab9370a2886c3be9b4.shtml" target= "_ Blank ">
<div style= "width:190px; height:160px, "top=" 0 "left=" 196 ">
</div>
</a>
//</div>
Mask layer (when the mouse moves to the specified area, the area is displayed, the other is translucent, and all is displayed when moving)