<!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>
<title>一个Banner广告收缩效果</title>
<style type="text/css">
*{margin:0; padding:0;}/*为了方便 直接这样重置了*/
#main{margin:0 auto; width:960px;}
#banner{display:none; margin:0 auto; width:960px; height:160px; background:url(http://www.codefans.net/jscss/demoimg/201107/banner.png) no-repeat; position:relative;}
#close{display:block; width:50px; height:22px; text-align:center; line-height:22px; border:1px #ddd solid; background:#000; color:#fff; font-size:12px; float:right; cursor:pointer;}
</style>
<script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script>
<script type="text/javascript">
$
(
function()
{
$("#banner").slideDown();
var Up=function(){$("#banner").slideUp(1500)}
setTimeout(Up,3000);
$("#close").click
(
function()
{
$("#banner").slideToggle
(
600,function()
{
if($("#banner").css("display") == "none")
{
$("#close").text("打开");
}
else
{
$("#close").text("关闭");
}
}
);
}
);
}
);
</script>
</head>
<body>
<div id="main">
<div id="banner"></div>
<span id="close">关闭</span>
</div>
</body>
</html>

一个Banner广告收缩效果的更多相关文章

  1. 两种方法使用js读写cookie实现一个底部广告浮层效果

    下面一个案例实现了js实现一个页面浮层并且使用两种方法使用js读写cookie:来实现用户关闭广告的显示状态: 读者可以将下面代码复制到一个html文件试试效果:html的pre标签未两种js实现的方 ...

  2. 如何在RCP程序中添加一个banner栏

    前言:这段时间还算比较空闲,我准备把过去做过的有些形形色色,甚至有些奇怪的研究总结一下,也许刚好有人用的着也不一定,不枉为之抓耳挠腮的时光和浪费的电力.以前有个客户提出要在RCP程序中添加一个bann ...

  3. Android开发之ViewPager实现轮播图（轮播广告）效果的自定义View

    最近开发中需要做一个类似京东首页那样的广告轮播效果,于是采用ViewPager自己自定义了一个轮播图效果的View. 主要原理就是利用定时任务器定时切换ViewPager的页面. 效果图如下: 主页面 ...

  4. Android 原生listview item伸展收缩效果 （续）

    接上一个原生的listview item的伸展收缩效果. 上一个可能做的有些粗糙,效果也没有这个好,上代码. package com.example.listviewdemo; import java ...

  5. Javascript 广告浮动效果在浏览器中间N秒后移动到右下角

    Javascript 广告浮动效果在浏览器中间N秒后移动到右下角 闲着无聊做了一个,本人原创...就是这个页面的广告效果....怎么样???? 刚刚学习的javascript

  6. [Swift通天遁地]八、媒体与动画-(3)实现视频播放的水印、Overlay、暂停时插入广告等效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  7. 广告投放效果难判断？集成华为DTM为您轻松实现！

    在进行广告投放时,你是否遇到这样的困扰: 花了一大笔预算去投放推广,不知道实际效果如何? 用户看到投放的广告,产生了哪些有价值的行为? 当前广告投放的渠道和类型等投放策略,是否需要调整? 此时我们就需 ...

  8. 一个不错的loading效果--IT蓝豹

    一个不错的loading效果 介绍:一个不错的loading加载效果,弹性收缩,效果不错,学习android动画的朋友可以下载来研究研究本例子其实由SeekBar实现,由MetaballView,Me ...

  9. jQuery图片旋转展示收缩效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. UML基础知识

    UML:Unified Modeling Language,即统一建模语言.是一种图形化的建模语言标准. 如上图,UML可以帮助我们做软件需求分析和软件设计两方面的工作,在不同的应用场景中,UML的一 ...

  2. Linux_x64安装Oracle11g（完整版）

    一.修改操作系统核心参数 在Root用户下执行以下步骤: 1)修改用户的SHELL的限制,修改/etc/security/limits.conf文件 输入命令:vi /etc/security/lim ...

  3. Java_观察者模式（Observable和Observer） -转

    原文地址: Java_观察者模式(Observable和Observer) 一.观察者模式介绍    在Java中通过Observable类和Observer接口实现了观察者模式.一个Observer ...

  4. 最新版 CocoaPods 的安装流程(包括EI Capitan版)

    1.移除现有Ruby默认源 $gem sources --remove https://rubygems.org/ 2.使用新的源 $gem sources -a https://ruby.taoba ...

  5. progit-zh（Git中文文档）

    发现好像在墙外,还是下载下来看会快点 链接: http://pan.baidu.com/s/1o8EiDMq 密码: vzf9

  6. python 登陆一个网站

    今天想用python写一个登陆的脚本,搜了一下,网上挺多的,看了一些后写了个登陆虎扑论坛的脚本. 原理: 只要在发送http请求时,带上含有正常登陆的cookie就可以了. 1.首先我们要先了解coo ...

  7. JqueryUI插件网络连接

    operamasks_UI官网 http://ui.operamasks.org/website/homepage.html EasyUI官网 http://www.jeasyui.com/index ...

  8. css应用三

    1. Padding与margin Padding为内边距,padding值会计算在width和height之内.如:width:100px:height:100px:padding:10px:该di ...

  9. POJ2151 动态规划

    #include <iostream> #include <cstring> #include <cstdio> using namespace std; int ...

  10. 当开始输入文字以及完成文字输入时，变换text field的背景以及系统自带一键删除的 叉叉

    当开始输入文字以及完成文字输入时,变换text field的背景. -(BOOL) textFieldShouldBeginEditing:(UITextField *)textField{ [tex ...