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

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

作者:闵涛 文章来源:闵涛的学习笔记 点击数:2675 更新时间: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的内容
    An error occurred on the server when processing the URL. Please contact the system administrator.

    If you are the system administrator please click here to find out more about this error.

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

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

    站长:MinTao 信息产业部ICP备案号:鄂ICP备11006601号

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