仿CSDN 右下角悬挂的浮动层效果

(编辑：jimmy 日期: 2025/10/1 浏览：2)

<!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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>ads</title> <style type="text/css"> body{ font-size:12px; margin:0px; } /**for ads**/ h1{ font-size:14px; } .ads{ margin:0px auto; width:325px; height:190px; border:1px solid #ddd; } </style> </head> <body> <h1>CSDN右下角悬挂效果</h1>  <style type="text/css"> #ads_14{ float:right; font-family: verdana,sans-serif; } #ads_14 H6 { width:282px; height:27px; padding:0px; margin:0px; background:url(images/skin/bg.gif) no-repeat; } #ads_14 #drag { cursor:move; } #ads_14 #head { float:right; width:45px; height:27px; line-height:27px; cursor:pointer; } #msg_top { width:279px; height:105px; border-left:#CDCDCD 1px solid; border-right:#CDCDCD 1px solid; } ul { padding:0px; margin:0px; list-style:none; } .msg_top_left { float:left; width:80px; height:105px; padding-right:10px; border-bottom:#CDCDCD 1px dashed; } .msg_top_right { float:left; width:175px; height:105px; padding-left:10px; border-bottom:#CDCDCD 1px dashed; } .msg_top_right a { font-size:12px; text-decoration:none; line-height:20px; } #msg_buttom { width:279px; height:100px; border-left:#CDCDCD 1px solid; border-right:#CDCDCD 1px solid; border-bottom:#CDCDCD 1px solid; } #msg_buttom ul { float:left; width:120px; height:102px; line-height:20px; padding:5px; } </style>  <h6 id="drag"><em><a href="javascript:;" onclick="showimg('/UploadFiles/2021-04-02/small.gif');"><img src="/UploadFiles/2021-04-02/small.gif" alt="仿CSDN 右下角悬挂的浮动层效果" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)" border="0"/></a></em><em>&nbsp;&nbsp;&nbsp;</em><em><a href="javascript:;" onclick="showimg('/UploadFiles/2021-04-02/close.gif');"><img src="/UploadFiles/2021-04-02/close.gif" alt="仿CSDN 右下角悬挂的浮动层效果" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)" border="0"/></a></em></h6>  <ul class="msg_top_left"> <li> <a href="javascript:;" onclick="showimg('/UploadFiles/2021-04-02/untitled.bmp');"><img src="/UploadFiles/2021-04-02/untitled.bmp" alt="仿CSDN 右下角悬挂的浮动层效果" onmousewheel="return bbimg(this)" onload="javascript:resizepic(this)" border="0"/></a> </li> </ul> <ul class="msg_top_right"> <LI>微软启动最严厉反盗版验证</LI> <LI>Mozilla建开发者工具实验室</LI> <LI>Google Apps安全漏洞揭秘</LI> <LI>微软发布Silverlight2 </LI> <LI>WinHEC邀您一起揭开Window</LI> </ul>   <ul> <li>微软与您畅享[奇迹之</li> <li>汽车信息化机遇与挑战</li> <li>计算机程序的行为学</li> <li>独立思考能力从哪里来</li> </ul> <ul> <li>避免肥胖十五条法则</li> <li>清明节第一次相亲</li> <li>不要爱上论坛女人</li> <li>IBM</li> </ul>        </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一篇：右下角广告脚本之家出品(点击广告后出现关闭按钮可关闭)

下一篇：firefox TBODY 用js显示和隐藏时出现错位的解决方法