效果图如下：

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. 根据时间显示不同的问候语的JavaScript代码

    对于最近有许多的初学开发者问我关于根据时间显示不同的问候语的JavaScript代码问题,所以今天将自己整理的一些代码在这里分享出来,供初学者参考,如果在运行过程中有问题,可以给我在下方留言. < ...

  2. C# 将外部exe程序 嵌入到自己的窗体界面

    将别人开发的exe程序,放到自己的窗体里面来运行. 1.基本功能实现 首先,在自己的窗体后面加上代码: [DllImport("User32.dll", EntryPoint = ...

  3. 四、Oracle loop循环、while循环、for循环、if选择和case选择、更改读取数据、游标、触发器、存储过程

    数据库的设计(DataBase Design): 针对于用户特定的需求,然后我们创建出来一个最使用而且性能高的数据库! 数据库设计的步骤: 01.需求分析 02.概念结构设计 03.逻辑结构设计 04 ...

  4. c++ 控制台输入参数

    #include <iostream>#include <string> using namespace std; int main(int argc,char **argv) ...

  5. SQL Union和Union All使用方法

    格式: [SQL 语句 1]UNION [SQL 语句 2] 对两个结果集进行并集操作,不包括重复行,同时进行默认规则的排序: select ID,NAME from A UNION select I ...

  6. TeamViewer安装使用

    1.下载安装包 官网下载最新安装包 2.安装步骤 3.连接 输入密码即可控制伙伴电脑.

  7. Struts2_HelloWorld_7_2

    第一个程序的流程图: Struts2.x 的作用:把请求和展现分开.

  8. 时域反射计(TDR)原理与应用

    [施工编辑中...] 1. 什么是TDR? TDR = Time Domain Reflectometry 时域反射计TDR用来测量信号在通过某类传输环境传导时引起的反射,如电路板轨迹.电缆.连接器等 ...

  9. Spring Cloud程序报错总结

    1.com.sun.jersey.api.client.ClientHandlerException: java.net.ConnectException: 原因如下: 在默认设置下,Eureka服务 ...

  10. Django基础--4

    补充知识-路由系统(URL) URL传递额外的参数 在url.py里,除了默认会传一个request给处理函数,还可以传递额外的参数,把一个字典作为第三个参数传入,之后就可以在处理函数里取到对应的值: ...