<!DOCTYPE html>

<html>

<head lang="en">

  <meta charset="UTF-8">

  <title></title>

  <style type="text/css">

    .ad {

      position: fixed;

      right: ;

      bottom: ;

      width: 230px;

      height: 120px;

      background-image: url(imgs/ad.jpg);

      display: none;

    }

    .ad span {

      position: absolute;

      right: ;

      top: ;

      width: 40px;

      height: 18px;

      background-image: url(imgs/h.jpg);

      cursor: pointer;

    }

  </style>

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

  <script>

    $(document).ready(function() {

      $(".ad")

        .slideDown("normal")

        .slideUp("slow")

        .fadeIn()

        .children("span").click(function() {

          $(this).parent().fadeOut();

        });

    });

  </script>

</head>

<body>

  <div class="ani">我是内容</div>

  <div class="ad">

    <span></span>

  </div>

</body>

</html>

jquery版右下角弹窗效果的更多相关文章

  1. 一个基于jQuery写的弹窗效果(附源码)

    最近项目中频繁遇到需要弹出窗口的功能,一直使用浏览器默认的Alert和Confirm弹窗,感觉视觉效果不是那么好,而从网上下载的话又找不到合适的,找到的话有些也是十分臃肿,有时候感觉学习配置的功夫自己 ...

  2. winform下如何实现右下角弹窗效果

    [DllImport("user32")] private static extern bool AnimateWindow(IntPtr hwnd, int dwTime, in ...

  3. JQuery实现的弹窗效果

    这是笔者实际项目中的一个需求,我们先来看看特效. 页面加载时弹出窗口,点击关闭按钮,窗口消失并呈现动画效果. 实现代码如下: <!DOCTYPE HTML PUBLIC "-//W3C ...

  4. jquery版tab切换效果

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  5. 【转载】jquery版的网页倒计时效果

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  6. jquery版的网页倒计时效果

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  7. jquery实现登录后右下角弹窗提醒（附带简单样式）

    页面代码如下:   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...

  8. jQuery实现广告弹窗

    首先设置一个固定的窗口位于右下角,效果如下: 代码: jQuery实现广告弹窗.html 之后将该窗口初始设为隐藏,通过代码实现3秒自动显示,5秒自动隐藏,其效果如下: <!DOCTYPE ht ...

  9. 用CSS3动画特效实现弹窗效果

    提示:如果大家觉得本篇实现的弹窗效果有用,可持续关注.接下会添加更多效果并且封装成插件,这样使用就方便了.效果查看: https://heavis.github.io/hidialog/index.h ...

随机推荐

  1. Redis安装配置及在Python上的应用

    最近在使用Kazoo(开源电话系统) API时,一次请求的处理需要调用几次API,只为了得到一个name和id的对应关系,耗时非常大,开始想使用一种简单的实现,直接将对应关系保存到静态类的静态变量中, ...

  2. World Wind Java开发之四——搭建本地WMS服务器（转）

    在提供地理信息系统客户端时,NASA还为用户提供了开源的WMS Server 服务器应用:World Wind WMS Server.利用这个应用,我们可以架设自己的WMS服务并使用自己的数据(也支持 ...

  3. java—三大框架详解，其发展过程及掌握的Java技术慨括

    Struts.Hibernate和Spring是我们Java开发中的常用关键,他们分别针对不同的应用场景给出最合适的解决方案.但你是否知道,这些知名框架最初是怎样产生的? 我们知道,传统的Java W ...

  4. Wired Memory

    https://developer.apple.com/library/content/documentation/Performance/Conceptual/ManagingMemory/Arti ...

  5. Linux 文件的压缩与解压

    1.  tar结尾压缩命令 [root@test ~]# tar -cvf grub.tar /boot/grub/ 查看压缩包文件 [root@test ~]# tar -vtf grub.tar ...

  6. 【BZOJ1854】[SCOI2010] 游戏（匈牙利算法的应用）

    点此看题面 大致题意: 有\(n\)个物品,每个物品有两个属性且只能选择其中的一个,要求选择的物品属性值从\(1\)开始递增,问最多能选多少个. 暴搜 看到这题,我第一反应是暴搜... ... 好不容 ...

  7. 2017.12.17 servlet 生命周期

    servlet生命周期一般分为4个: 加载----实例化------服务-----销毁 (1)加载: 加载一般是在运行tomcat容器时来完成,将servlet类加载到tomcat中,或者是客户端发来 ...

  8. python_54_函数调用函数

    logger函数的定义要放在函数调用之前,在test1(1,2)前边,一下两种都可以 def test1(x,y): print(x,y) logger('Test1') def logger(sou ...

  9. vue组件-使用插槽分发内容(slot)

    slot--使用插槽分发内容(位置.槽口:作用: 占个位置) 官网API: https://cn.vuejs.org/v2/guide/components.html#使用插槽分发内容 使用组件时,有 ...

  10. shell中字符串基本用法

    前言 今天在写脚本时,发现前阶段使用过的一些用法还是需要去百度查找,并且找到的答案还需要自己去筛选,耽误写脚本时间,这一篇对字符串之间的比较和逻辑判断都非常详细,借鉴他人之作,资源共享. 本片主要说明 ...