关闭

鼠标移动到图片出现按钮,点击删除图片

标签: jquery
3145人阅读 评论(0) 收藏 举报
分类:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<style type="text/css">
  .btnbox{
  z-index:999;
  position:relative;
  left:400px;
  top:-350px;
}
</style>

<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
  function show(thisObj)
  {
	$(thisObj).children("div").css("display","block");
  }

  function hide(thisObj)
  {
	$(thisObj).children("div").css("display","none");
  }

  function aa(obj){
        $(obj).parent().parent().remove();
  }
</script>

</head>
<body>
    <div id="content">   
       <div  onmouseover="show(this)" onmouseout="hide(this)"  style="float:left">
         <img src="img2.jpg"/>
         
         <div class="btnbox" style="width:170px; height:20px;" >
          <input type="button" value="testbtn1"  onclick="aa(this)"/>
         </div>
         
       </div>
       
       <div  onmouseover="show(this)" onmouseout="hide(this)"   style="float:left">
         <img src="img2.jpg"/>
         
         <div class="btnbox" style="width:170px; height:20px;" >
          <input type="button" value="testbtn2"  onclick="aa(this)"/>
         </div>
         
       <div>
    </div>
</body>
</html>



0
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

图片的预览、全选、删除(jquery)

.style1 { width: 40%; text-align:center; ...
  • hjingtao
  • hjingtao
  • 2012-03-13 21:16
  • 5220

鼠标划过div右上角显示删除叉,瀑布流效果

鼠标划过div右上角显示删除叉,瀑布流效果
  • vaecnfeilong
  • vaecnfeilong
  • 2014-01-07 15:07
  • 5538

【css基础】html图片右上角加上删除按钮

DOCTYPE html> html> head>     meta http-equiv="Content-Type" content="text/html; char...
  • qq_33464127
  • qq_33464127
  • 2017-08-23 15:21
  • 1178

js Dialog 去掉右上角的 'X' 功能

再用到 dialog弹出框时,不想要右上角的X 关闭功能,只是做个提示信息
  • hejiakuo
  • hejiakuo
  • 2014-04-15 18:47
  • 1154

JS操作图片(添加,更改,删除)

Image     {         width:100px;         height:100px;         }   ...
  • linlin2294592017
  • linlin2294592017
  • 2013-04-16 17:11
  • 12725

android中EditText点击右边叉叉按钮(或图片)清除输入框内的文字的实现

如题,此功能用到的较多,实现的方法也不难,这里只提供了一种思路。
  • JWfine
  • JWfine
  • 2016-09-02 19:08
  • 1380

图片特效展示(鼠标移入移除特效)

太久没动手了,又断续复习一些以前学过的东西。今天我写的是一个图片展示特效。鼠标onmouseover图片的时候,介绍缓慢出现;移除时候介绍回到原位。代码如下:          图片展示特...
  • sinat_21206105
  • sinat_21206105
  • 2016-12-19 14:44
  • 808

HoverEx-jQuery鼠标悬停在图片上显示说明按钮插件

  • 2015-02-06 09:43
  • 663KB
  • 下载

利用jquery移除和添加图片

利用jquery移除和添加图片 1、样式     .changeImage{          background:url(images/right.png) no-repeat ...
  • you23hai45
  • you23hai45
  • 2014-08-25 22:35
  • 3809

JS操作图片(添加,更改,删除)

Image     {         width:100px;         height:100px;         }   ...
  • linlin2294592017
  • linlin2294592017
  • 2013-04-16 17:11
  • 12725
    个人资料
    • 访问:662346次
    • 积分:7006
    • 等级:
    • 排名:第3810名
    • 原创:86篇
    • 转载:280篇
    • 译文:0篇
    • 评论:51条
    博客专栏
    文章分类
    最新评论