Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[素材] 快速移动到顶部底部,还带缓慢移动,兼容1.5、2.0

[复制链接]
KiSsゞ 发表于 2011-5-27 22:06:47 | 显示全部楼层 |阅读模式
本帖最后由 KiSsゞ 于 2012-4-6 14:30 编辑

先看演示图哈,




由于网站升级到2.0,所以演示就没有啦
有这些按钮会方便很多的哦,直接移到顶部底部,而且还可以换慢移动的。

下面是代码,这个代码是我从飞吧上面拿下来的,只是为了分享给大家行个方便。如果有侵犯之类的,请告诉我,我会马上删掉的

找到风格模板 template/你的风格模板名字/common/header.htm

查找
  1. <!--{hook/global_header}-->
  2. <!--{/if}-->
  3. <div id="wp" class="wp">
复制代码
在下面加上以下代码
  1. <style type="text/css">
  2. * {
  3. padding:0;
  4. margin:0;
  5. }
  6. #fixedLayertop {
  7. width:30px;
  8. line-height:50px;
  9. position:fixed;
  10. right:30px;
  11. top:120px;
  12. }
  13. </style>
  14. <!--[if lte IE 6]>
  15. <style type="text/css">
  16. * html,* html body /* 修正IE6振动bug */{background-image:url(about:blank);background-attachment:fixed;}
  17. #fixedLayertop{
  18. position:absolute;
  19. bottom:auto;top:
  20. expression(eval(document.documentElement.scrollTop)+120+"px");
  21. }
  22. </style>
  23. <![endif]-->
  24. <script language="javascript">
  25. suspendcode="<div id='fixedLayertop'><a onclick='javascript:amutop();return false;' href='#' title='快速回页面顶部'><img border=0 src="/images/top.png" width="30"></a>
  26. <a onclick='javascript:history.back();return false;' href='#' title='返回上一页'><img border=0 src="/images/back.png" width="30"></a>
  27. <a onclick='javascript:sc();return false;' href='#' title='暂停向下缓移'><img border=0 src="/images/ting.png" width="30"></a>
  28. <a onclick='javascript:clearInterval(timer);initialize();return false;' href='#' title='向下缓移'><img border=0 src="/images/gun.png" width="30"></a>
  29. <a onclick='javascript:amubutton();return false;' href='#' title='快速移到页面底部'><img border=0 src="/images/end.png" width="30"></a></div>"
  30. document.write(suspendcode);

  31. var currentpos,timer;
  32. function initialize()
  33. {
  34. timer=setInterval ("scrollwindow ()",30);
  35. }
  36. function sc()
  37. {
  38. clearInterval(timer);
  39. }
  40. function scrollwindow()
  41. {

  42. currentpos = document.documentElement.scrollTop || document.body.scrollTop;

  43. window.scrollTo(0,++currentpos);
  44. //window.alert(currentpos)
  45. //if (currentpos>10)
  46. //sc();
  47. }
  48. //document.onmousedown=sc;
  49. function amutop()
  50. {
  51. window.scrollTo(0,0)
  52. clearInterval(timer);
  53. }
  54. function amubutton()
  55. {
  56. window.scrollTo(0,80000)
  57. clearInterval(timer);
  58. }
  59. </script>
复制代码
完成这些之后还没好哦,记得要把图片上传上去哈。

下面是图片附件,直接解压上传到根目录就可以了

http://www.yiranes.com/thread-61-1-1.html
也可以到这里下载哈,当是送我个ip嘛,谢谢谢谢~~~~{:soso_e163:}




















本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
 楼主| KiSsゞ 发表于 2011-5-27 22:08:22 | 显示全部楼层
回复

使用道具 举报

 楼主| KiSsゞ 发表于 2011-5-27 22:08:44 | 显示全部楼层
自己沙发
回复

使用道具 举报

aliang520 发表于 2011-5-27 22:09:22 | 显示全部楼层
支持
回复

使用道具 举报

 楼主| KiSsゞ 发表于 2011-5-27 22:14:02 | 显示全部楼层
aliang520 发表于 2011-5-27 22:09
支持

感谢支持
回复

使用道具 举报

dashou 发表于 2011-5-27 22:17:28 | 显示全部楼层
回复

使用道具 举报

itishome 发表于 2011-5-27 22:17:31 | 显示全部楼层
用淘客的 域名!不好吧 而且打不开你的网站 什么原因?
回复

使用道具 举报

 楼主| KiSsゞ 发表于 2011-5-27 22:19:06 | 显示全部楼层
itishome 发表于 2011-5-27 22:17
用淘客的 域名!不好吧 而且打不开你的网站 什么原因?

可以打开啊
回复

使用道具 举报

 楼主| KiSsゞ 发表于 2011-5-27 22:28:07 | 显示全部楼层
是不是要改模板就没什么人需要呢
回复

使用道具 举报

ilei365 发表于 2011-5-27 22:28:16 | 显示全部楼层
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-16 22:40 , Processed in 0.027930 second(s), 3 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表