如题,使用Javascript,实现点击图片可弹出大图,大图可关闭?
新手求问!
谢谢
2条回答 默认 最新
关注 你说的是lightBox效果吧 ? 给你段代码:
<!DOCTYPE html> <meta charset="utf-8"> <html> <head> <title>Lightbox效果</title> <style type="text/css"> .black_overlay{ display: none; position: absolute; top: 0%;left: 0%; width: 100%; height: 100%; background-color: black; z-index: 1001; opacity: .70; } .white_content{ display: none; position: absolute; top: 30%; left: 30%; width: 40%; height: 40%; padding: 16px; border: 16px solid orange; background-color: white; z-index: 1002; overflow: auto; } </style> </head> <body> <a href="javascript:void(0)" onclick="document.getElementById('light').style.display='block'; document.getElementById('fade').style.display='block'">请单击这里</a> <div id="light" class="white_content"> 这里是lightbox的弹出框的内容 <a href="javascript:void(0)" onclick="document.getElementById('light').style.display='none'; document.getElementById('fade').style.display='none'">关闭</a> </div> <div id="fade" class="black_overlay"></div> </body> </html>
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 素材场景中光线烘焙后灯光失效
- ¥15 请教一下各位,为什么我这个没有实现模拟点击
- ¥15 执行 virtuoso 命令后,界面没有,cadence 启动不起来
- ¥50 comfyui下连接animatediff节点生成视频质量非常差的原因
- ¥20 有关区间dp的问题求解
- ¥15 多电路系统共用电源的串扰问题
- ¥15 slam rangenet++配置
- ¥15 有没有研究水声通信方面的帮我改俩matlab代码
- ¥15 ubuntu子系统密码忘记
- ¥15 保护模式-系统加载-段寄存器