转至繁体中文版     | 网站首页 | 图文教程 | 资源下载 | 站长博客 | 图片素材 | 武汉seo | 武汉网站优化 | 
最新公告:     敏韬网|教学资源学习资料永久免费分享站!  [mintao  2008年9月2日]        
您现在的位置: 学习笔记 >> 图文教程 >> 站长学院 >> Web开发 >> 正文
[图文]js+css实现DIV层悬浮的网页右侧的,并且可以关闭         ★★★

js+css实现DIV层悬浮的网页右侧的,并且可以关闭

作者:闵涛 文章来源:闵涛的学习笔记 点击数:3192 更新时间:2011/2/9 10:13:24

js+css实现DIV层悬浮的网页右侧的,并且可以关闭,这是一个简单的使用JS+CSS实现的DIV层在网页的右侧浮动,可以上下自动浮动,我们可以把这个层放入广告或者重要信息公告提示等等,还是比较有用的,但是这个浮动的DIV不要多了,有一个就好了:

以下是代码片段:
<!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>网页右侧可关闭的漂浮窗口 敏韬网-Www.MinTao.Net</title>
    <meta http-equiv="content-type" content="text/html;charset=gb2312">
    </head>
    <body>
    <div id="ShowAD" style="position:absolute;z-index:100;">
    <div style="width:115;height:18px;font-size:14px;font-weight:bold;text-align:left;cursor:hand;" onClick="closead();"><font color="ff0000">关闭</font></div>
    这个窗口可以关闭噢?可以放漂浮广告哦!敏韬网-Www.MinTao.Net<br><a href="tencent://message/?uin=543098146&Site=敏韬网-文内&Menu=yes"><img src="http://www.mintao.net/images/kefuqq/qq_yanshi.gif"></a>
    </div>
    <script language="javascript">
    var bodyfrm = ( document.compatMode.toLowerCase()=="css1compat" ) ? document.documentElement : document.body;
    var adst = document.getElementById("ShowAD").style;
    adst.top = ( bodyfrm.clientHeight -468 ) + "px";
    adst.left = ( bodyfrm.clientWidth -115 ) + "px";
    function moveR() {
    adst.top = ( bodyfrm.scrollTop + bodyfrm.clientHeight - 468) + "px";
    adst.left = ( bodyfrm.scrollLeft + bodyfrm.clientWidth - 115 ) + "px";
    }
    setInterval("moveR();", 80);
    function closead()
    {
    adst.display='none';
    }
    </script>
    <div id="Content" style="height:900px;">闵涛专业为你提供各类网站程序、源码的定制、修改,网站相关技术的全程指导,欢迎与我取得联系,联系QQ:543098146,网址:www.mintao.net</div>
    </body>
    </html>

具体示例请参照敏韬网右侧悬浮样式。


[网络安全]如何关闭端口防止病毒与黑客入侵  [网页制作]关闭页面不出现提示的多种解决方案
[网页制作]可折叠、关闭的文章显示栏目div+css源代码示例  [办公软件]使用Vba读取已关闭的Excel工作薄数据到当前工作表…
[办公软件]利用VBA从已关闭的工作薄中取得某一工作表某一单元…  [操作系统]禁用(关闭)WIN2003关机事件跟踪程序(不用输入信息…
[操作系统]你真的了解关闭计算机系统(关机)吗?  [操作系统]大体介绍一下不能关闭的系统服务组件
[网络技术]详细介绍如何打开、关闭端口  [电脑技术](关闭)禁用不想开机自运行的程序
教程录入:mintao    责任编辑:mintao 
  • 上一篇教程:

  • 下一篇教程:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
      注:本站部分文章源于互联网,版权归原作者所有!如有侵权,请原作者与本站联系,本站将立即删除! 本站文章除特别注明外均可转载,但需注明出处! [MinTao学以致用网]
      网友评论:(只显示最新10条。评论内容只代表网友观点,与本站立场无关!)

    同类栏目
    · Web开发  · 网页制作
    · 平面设计  · 网站运营
    · 网站推广  · 搜索优化
    · 建站心得  · 站长故事
    · 互联动态
    更多内容
    热门推荐 更多内容
  • 没有教程
  • 赞助链接
    更多内容
    闵涛博文 更多关于武汉SEO的内容
    500 - 内部服务器错误。

    500 - 内部服务器错误。

    您查找的资源存在问题,因而无法显示。

    | 设为首页 |加入收藏 | 联系站长 | 友情链接 | 版权申明 | 广告服务
    MinTao学以致用网

    Copyright @ 2007-2012 敏韬网(敏而好学,文韬武略--MinTao.Net)(学习笔记) Inc All Rights Reserved.
    闵涛 投放广告、内容合作请Q我! E_mail:admin@mintao.net(欢迎提供学习资源)

    站长:MinTao ICP备案号:鄂ICP备11006601号-18

    闵涛站盟:医药大全-武穴网A打造BCD……
    咸宁网络警察报警平台