效果图如下：

HTML代码如下：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

    .left,.right{

        position: fixed;

        top: 250px;

    }

    .left{

        left: 0;

    }

    .right{

        right: 0;

    }

    .left span,.right span{

        width: 20px;

        height: 20px;

        background: #ccc;

        font-size: 14px;

        color: #333;

        position: absolute;

        right: 0;

        top: 0;

        text-align: center;

        cursor: pointer;

    }

    </style>

    <script src="js/jquery-1.12.4.min.js"></script>

    <script>

    $(function(){

        $('span').click(function(){

            $(this).parent().hide(500);

        });

    })

    </script>

</head>

<body>

    <div class="left"><img src="data:images/left.jpg" alt=""><span>X</span></div>

    <div class="right"><img src="data:images/right.jpg" alt=""><span>X</span></div>

</body>

</html>

　　

JQuery实现父级选择器(广告实现)的更多相关文章

  1. less-符号之逗号，空格，父级选择器

    Less符号 逗号 example: .test() { box-shadow+: inset 0 0 10px #555; } .study { .test(); box-shadow+: 0 0 ...

  2. 虚构 css 父级选择器

    能 CSS 解决的绝不用 JS,这句话又一次故作装逼地说出来还是挺爽的... 比如下拉列表,能用 CSS 的 :focus 就不用 JS 的 .on("focus blur") 能 ...

  3. [jQuery]相对父级元素的fixed定位

    (function($) {     var DNG = {};     //----------------------------------------------------/     // ...

  4. jquery的父级和兄弟级能做多少网页特效

    这里说的父级就是parent  兄弟级就是siblings 我这里说一个导航栏用到的特效 主要jquery代码$(this).parent().addClass(“active”).siblings( ...

  5. JQuery 获取父级元素、同级元素、子元素等

    例: <div> <div id="div_1">这是内容1</div> <div id="div_2">这是内 ...

  6. 转载：js和jquery获取父级元素、子级元素、兄弟元素的方法

    转载网址: 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元 ...

  7. jQuery获取父级、兄弟节点的方法

    一.jQuery的父节点查找方法 $(selector).parent(selector):获取父节点 $(selector).parentNode:以node[]的形式存放父节点,如果没有父节点,则 ...

  8. js和jquery获取父级元素、子级元素、兄弟元素的方法{转}

    先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比 JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当成DOM元素   原生的 ...

  9. js和jquery获取父级元素、子级元素、兄弟元素的方法

    最近工作中总遇到取各种父啊子啊兄弟姐妹啊,每次都得查,这次整理个全乎的~ [js的获取方式] function dom(){      var a = document.getElementByIdx ...

随机推荐

  1. angularjs string format

    用惯了C#的string.format,在angularjs中还不太习惯字符串的拼接,还好可以自定义String.Format String.format = function() { ) retur ...

  2. http 中的缓存

    如何判断缓存新鲜度 If-Modified-Since告诉服务器, 在服务器中的响应报文中有一个Last-Modified字段, 如果两者一直则表示在浏览器中缓存的文件是最新的, 可以直接使用浏览器缓 ...

  3. GitKraken使用教程-基础部分(7)

    8.  本地分支和标签 1) 在提交记录区中查看分支状态 提交记录区中每一个分支都位于一个提交记录所在的行中. 从图 2‑1中可以看到,服务器上的master分支停留在整理格式(把这个提交记录记为or ...

  4. 会话状态在此上下文中不可用HttpModule中无法访问Session原因

    写了一个自定义HttpModule,但始终访问不了Session,代码如下: public class RouteModule : IHttpModule, System.Web.SessionSta ...

  5. spring整合web的ssh（springMVC、hibernate）

    1. tomcat启动时,加载配置文件,将bean装在 导入jar包spring-web..jar 2.确定配置文件位置 3.spring整合hibernate <!-- 加载hibernate ...

  6. （一）Hybrid app混合开发模式

    hybrid app是什么? 这里我们先看一下词条上的定义 Hybrid App:Hybrid App is a mobile application that is coded in both br ...

  7. 为什么要使用TLSv1.2和System SSL？

    FTP 和 Telnet 正是核心联网应用程序的两个示例.为 System SSL 编程接口编码的供应商应用程序可以通过更改代码来利用这些新支持. 这是安全套接层 (SSL) 协议的最新版本,也是最为 ...

  8. linux基础命令-chgrp/chown/chomd

    chgrp 改变所属用户组 要被改变的组名必须要在/etc/group文件内存在才行: chgrp [-R]   dirname/filename -R:进行递归的持续更改,连同子目录下的所有文件.目 ...

  9. COGS 182. [USACO Jan07] 均衡队形

    ★★   输入文件:lineup.in   输出文件:lineup.out   简单对比时间限制:4 s   内存限制:128 MB 题目描述 农夫约翰的 N (1 ≤ N ≤ 50,000) 头奶牛 ...

  10. JSON：json_encode函数不能获取属性原因及解决方案

    json_encode()是个解析json数据的函数,但是这个函数可以有两个参数 形式: json_decode ( string  $json,  ture || false )   第一个参数传字 ...