ks

使图片放在一行

ul{
width: 1200px;
list-style: none;
display: flex;
padding: 0px;
justify-content: space-between;
align-items: center;
}

使用flex步局

//鼠标悬浮小图片显示大图片

window.onload=function(){
var imgs=document.querySelectorAll(".small");//获取小图片
var big=document.querySelector(".big");//获取大图片
for (let i = 0; i < imgs.length; i++) {
//图片移动时执行时的方法
imgs[i].onmousemove=function(e){
big.style.top=e.y+10+"px";
big.style.left=e.x+10+"px";
big.src=this.src;
}
imgs[i].onmouseout=function(){
big.style.display="none";
}
imgs[i].onmouseenter=function(){
big.style.display="block";
}
}
}

全选/全不选

$(function(){
//全选/全不选
$("#chkAll").change(function(){
var gu1= $(this).prop("checked");
$(":checkbox:not([id])").prop("checked",gu1);
})
})
$(function(){
// 删除当前行
$("button").click(function(){
var gu =$(this).data("del");
// alert("您确定要删除编号为:"+gu+"的商品?");
if(confirm("您确定要删除编号为"+gu+"的商品?")){
$(this).closest('tr').remove();
}
})
})

 

上一篇:解决_tkinter.TclError: couldn‘t recognize data in image file...


下一篇:鼠标动画-图片动画