图片放大镜

//图片放大镜
eg:
$(function(){
$(".small_box").hover(function(){
//鼠标移入显示
$(this).find(".float_layer").show();
$(".big_box").show();
},function(){
//鼠标移出隐藏
$(this).find(".float_layer").hide();
$(".big_box").hide();
})
$(".small_box").mousemove(function(e){
//鼠标位置
var x=e.offsetX,y=e.offsetY;
//小黑框的左上角,-100 让鼠标永远在小黑框的中间
var left=x-100,top=y-100;
if(left<0){
left=0;
}
if(top<0){
top=0;
}
//超出不显示
if(left>200){
left=200;
}
if(top>200){
top=200;
}
$(this).find(".float_layer").css({
top:top+"px",
left:left+"px"
})

$(".big_box img").css({
//向反方向移动
top:-2*top+"px",
left:-2*left+"px"
})
})
})

//多余的部分隐藏

//closest：方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。
eg:
$(function(){
$(".load-more").click(function(){
if($(this).hasClass("active")){
$(this).removeClass("active").closest(".filter-list").css({"overflow":"hidden","height":"30px"});
}else{
$(this).addClass("active").closest(".filter-list").css({"overflow":"auto","height":"auto"});
}
})
})