<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>删除图标示例</title><style type="text/css">.img-wrap { position: relative; display: inline-block; border: 1px red solid; font-size: 0;}.img-wrap .close { position: absolute; top: 2px; right: 2px; z-index: 100; background-color: #FFF; padding: 5px 2px 2px; color: #000; font-weight: bold; cursor: pointer; opacity: .2; text-align: center; font-size: 22px; line-height: 10px; border-radius: 50%;}.img-wrap:hover .close { opacity: 1;}</style></head> <body><div class="img-wrap"> <span class="close">×</span> <img src="http://lorempixel.com/200/200" data-id="123"></div> <div class="img-wrap"> <span class="close">×</span> <img src="http://lorempixel.com/100/80" data-id="103"></div></body><script src="https://www.5t6t.com/skin/js/jquery-min.js" type="text/javascript"></script><script type="text/javascript">$('.img-wrap .close').on('click', function() { var id = $(this).closest('.img-wrap').find('img').data('id'); alert('remove picture: ' id);});</script></html>
下载图片右上角增加删除图标(css布局示例)用户还喜欢
- 18480 文章数
- 500万+ 热度
作者专栏
编辑推荐
- 淡抹u2引擎,修复内容较多,物有所值
- 界域传说·经典巨作=传世单机(一键安装)
- 丸子版本(175个传世版本大集合)
- GS版本:神话公益服务端+客户端
- 图片放大工具(放大图片不模糊)
- 剪映无限制VIP版
- 传奇世界客户端下载器,史上最全传世客户端
- 传世GS20220920商业引擎注册+登录配置器 解压密码是1
- U2官方排行榜游戏网关 支持元神,支持传家宝
- GS开战传世客户端+服务端
- (淡漠夕阳)u2引擎合区工具
- 传世GS引擎消除“你的游戏客户端版本号过旧,请及时更新”提示
- 传世一机多区双线路配置器--免密码版本
- 传世凤凰登陆器劫持修复软件
- SQLite3 for Navicat
- 传奇世界npc对话框编辑工具
- 传世GS落霞铭文服务器端
- gs_20210409引擎包+注册机(无限制)
- 传奇世界NPC对话封包查看器[支持时长版和极速版]
- 彩虹引擎传世脚本编辑工具1.7版来了,支持函数脚本翻译
评论