上一篇:你用QQ么,江湖上有个传说(图)
下一篇:JK 罗琳:不要畏惧失败,只要活着就必然要面对失败
用jQuery制作右下角浮动窗口(附代码)
米娅 2010年10月11日 20:14:24

许可证 LGPL License

<head>
<title>Coolder.com</title>
<script type="text/javascript" src="./fancybox/jquery-1.4.2.min.js"></script>
<style type="text/css">
#message_box {
  position: absolute;
  display: none;
  z-index: 10;
  background:#ffc;
  padding:5px;
  text-align:center;
  width:100px;;
  border: 1px solid #D2D2D2;
  -moz-box-shadow: 0 0 30px #CCC;
  -webkit-box-shadow: 0 0 30px #CCC;
  box-shadow: 0 0 30px #CCC;
  background: #FFF;
  background: -webkit-gradient(linear, left top, left 15, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
  background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 15px);
}
</style>
</head>

<body onload="init1()">
<div id="message_box"> 
  <img id="close_message" style="float:right; cursor:pointer" src="pics/makingface.gif" title="点击此处关闭" />  
  <a href="http://www.coolder.com/gallery"><font style="font-size:12px;">点击此处,并默念“芝麻开门”,加拿大风情,原创图片,不要错过哟</font></a>
</div>
</body> 

<script type="text/javascript">
$(window).scroll(function() { 
 $('#message_box').css("top",$(window).height()+$(window).scrollTop()-120 +"px");
 $('#message_box').css("left",$(window).width()+$(window).scrollLeft() -145 +"px");});

$(window).resize(function() { 
  $('#message_box').css("top",$(window).height()-120 +"px");
  $('#message_box').css("left",$(window).width()-145 +"px");});

$('#close_message').click(function(){  
  $('#message_box').animate({ top:"+=15px",opacity:0 }, "slow");});   

function init1() {
  $('#message_box').css("top",$(window).height()-120 +"px");
  $('#message_box').css("left",$(window).width()-145 +"px");
  $('#message_box').css("display","block");};
</script>



2楼 2010年10月11日 22:14:21 米娅

或者直接到这里下载php文件,程序在IE8,Firefox,Google Chrome下表现良好。Smile

第1页 共1页
相关链接
1. 网页自动跳转代码
2. 背景固定CSS代码
3. 在本页内运用标签跳转(附html代码)
4. 网页防复制(附代码)
5. Drupal 7: 多站点,一套核心代码,一套数据库,共用用户数据,一次登陆,同步session
6. 将Excel数据保存到MySQL数据库及PHP读Excel数据(附代码)
7. 自动发帖机原理和代码
8. 传递selected OPTION 的值到表单的一个hidden INPUT(附代码)
9. XMLHttpRequest中文乱码解决方法(附代码)
10. 如何解决有些浏览器flash文件(.swf)不显示的问题(附代码)
11. 如何用Adobe Flash CS4和ActionScript 3.0添加超级链接(附代码)
12. 如何得到flash(.swf)的资源,比如图片、代码 - 反编译
13. 如何在Adobe Flash CS4中给flash加入超级链接(附代码)
14. 如何在网页嵌入flash,并无警告提示播放(附代码)
15. 网页右键禁用JavaScript代码
16. 在结果页显示前显示进度条,代码