添加Back To Top + Scroll to top.
6.11.2011, 6/11/2011 - Permalink | 0 Comments
首先到Design-->Edit HTML
按Ctrl+F找</body>
在</body>的上面放上以下代码
p/s: 紧按Ctrl 和 C 键,就可拷贝了~但不可拷贝其他东西哦!只能拷贝代码~被博主查到,博主以后都不放博客教学哦!
代码: <a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='图片网址'/></a>
记得把图片网址 换掉哦!
博主我呢
提供一些图片给你们___
其实图片你去goggle/ baidu...., 打关键字就可以找到了___
图片网址:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCdZ7FaahTA0qytst1qWqHKXwdFoDN_4JXCgzDWxrKFfSPtVJSeNnbw1KFKPAijyfj7Xf199nkr_HitrBYg7-vEnxWxvWDWOqJM7ERneamEAzNSiOxqnRC3iEhzaApkSolcrDjB8_d9YvH/s1600/bttp-3.png
图片网址:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs64mwXbwnBFesM0Rh3kqPIse7pvWEiPn9QF4_V6s21bLYYUM6zZ9tKdk-8_UBIopnhQfnZqt9-963uIqRrUMfJtnDkNm18TwqDYipPw_SGZhfswnsBHgveDNl3hya6S6bm_K8yZoMRJJd/
图片网址:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSpo1nA-e59IxnHxJC65CaXGL6LRqRNFvJ2FBNsA7J0-bGUtIgqhwXXbB8QULDbBJlpzHGheOAOJoQF4t72loPSCsDQ1Qch5Kycwvp3YQRKuEYbhkzUJ0cJlmRtAQd1o0WqTD_IVg9GD8M/s400/bttp-13.png
图片网址:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFMd4P22UprxyKttVsj3AfnUsUu4A8uCBU80T-Phvkq7Q7tUfa1cN_fpnVkzt9LxDUMheSH-nkUj9s-7rLyJuwdmVj010VUJ9JloBG4oOxdt0C0TiNNN3Cxm0sbr04t480BYJI9KMNR6-j/s400/bttp-15.png
图片网址:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgW-B1LSr5ZhBsOLGxiUTN0oBy4BSVvDYlzCBVEpBrTMHcBbSwUAOp8Mu3M3mnXhqxFScvv5Qq-znrwh0k4EVl_NXLpamVdrqz9LbgDlQFQMzD4sMpNguPlzK30keAR8kLs4IOsX970fbCR/s320/BlurMetalLc2.gif
好了____就那么多___原谅博主是个无能的博主___只有这些____
好了、现在是Scroll To Top了.
什么是Scroll to top?
跟Back to top差不多一样的.
只是它是慢慢地划上去的.
就像博主的那样.
很简单的步骤、就是把下列的代码Copy 去HTML /JAVASCRIPT.
代码:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript">
var scrolltotop={setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},controlHTML: '<img src="图片网址" style="filter:alpha(opacity=70); -moz-opacity:0.1;" />',controlattrs: {offsetx:0, offsety:0},anchorkeyword: '#top',state: {isvisible:false, shouldvisible:false},scrollup:function(){if (!this.cssfixedsupport)this.$control.css({opacity:0})var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)if (typeof dest=="string" && jQuery('#'+dest).length==1)dest=jQuery('#'+dest).offset().topelsedest=0this.$body.animate({scrollTop: dest}, this.setting.scrollduration);},keepfixed:function(){var $window=jQuery(window)var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetxvar controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsetythis.$control.css({left:controlx+'px', top:controly+'px'})},togglecontrol:function(){var scrolltop=jQuery(window).scrollTop()if (!this.cssfixedsupport)this.keepfixed()this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : falseif (this.state.shouldvisible && !this.state.isvisible){this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])this.state.isvisible=true}else if (this.state.shouldvisible==false && this.state.isvisible){this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])this.state.isvisible=false}
},init:function(){jQuery(document).ready(function($){var mainobj=scrolltotopvar iebrws=document.allmainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards modemainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>').css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'}).attr({title:'Back to Top'}).click(function(){mainobj.scrollup(); return false}).appendTo('body')if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='')mainobj.$control.css({width:mainobj.$control.width()})mainobj.togglecontrol()$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){mainobj.scrollup()return false})$(window).bind('scroll resize', function(e){mainobj.togglecontrol()})
})
}
}scrolltotop.init()
</script>
保存即可.
标签: 博客教学