<html lang="en">
<head>
<meta charset="UTF-8">
<title>点击查看大图</title>
<style>
*{
box-sizing: border-box
padding: 0
margin: 0
}
.show-big{
position: fixed
width: 100%
height: 100%
left: 0
right: 0
bottom: 0
top: 0
display: none
background: rgba(0,0,0,.3)
}
.show-big img{
height: 100%
margin-left: 10%
}
.show-small{
width: 100px
margin: 100px auto
}
.show-small img{
width: 100%
}
</style>
</head>
<body>
<div class="show-big" id="big_img">
<img src="https://imgsa.baidu.com/baike/c0%3Dbaike116%2C5%2C5%2C116%2C38/sign=cf9bf05f9b58d109d0eea1e0b031a7da/c83d70cf3bc79f3dea137711b3a1cd11728b2924.jpg" alt="大图">
</div>
<div class="show-small" id="small_img">
<img src="https://imgsa.baidu.com/baike/c0%3Dbaike116%2C5%2C5%2C116%2C38/sign=cf9bf05f9b58d109d0eea1e0b031a7da/c83d70cf3bc79f3dea137711b3a1cd11728b2924.jpg" alt="小图">
</div>
<script>
var big_img = document.getElementById("big_img")
var small_img = document.getElementById("small_img").getElementsByTagName("img")[0]
small_img.onclick = function(){
big_img.style.display = "block"
}
big_img.onclick = function(){
big_img.style.display = "none"
}
</script>
</body>
</html>
默认只显示小图，点击小图会出现大图，点击大图或者灰色背景大图会消失。
你可以直接用js的重定向啊，window.location.href="........(这里填地址比如login.php)"或是你想跳出警告框，那就这么写alert（'用户名或密码不正确! '）连在一起这么写echo "<script>alert(''用户名或密码不正确! ')window.location.href='login.php'</script>"1.$("#msg").html($("#msg").html()+inner)其实不是失效了，而是dom树改变了，#msg 里面的内容改变，就不是原来的 .list 了
2.$("#msg").append($(inner)
新加入的 $(inner) ，不在原本的 $('.list') 集合里，因此新加入的没有被绑定事件
我这给出两种做法：
① 在 #msg 内容改变后，给新加入 .list 绑定一次 hover；
② 将事件绑在 $(document) 上，例：
$(document).on('mouseover','.list',function(){
//...
})
不过方法②貌似没有hover写法。
仅供参考~
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）