最近要做一个页面浮动按钮,一键置顶的功能。百度中找到的方法:
js:
(function() {
var $backToTopTxt = "", $backToTopEle = $('<div class="backToTop"></div>').appendTo($("body"))
.text($backToTopTxt).attr("title", $backToTopTxt).click(function() {
$("html, body").animate({ scrollTop: 0 }, 50);
}), $backToTopFun = function() {
var st = $(document).scrollTop(), winh = $(window).height();
(st > 0)? $backToTopEle.show(): $backToTopEle.hide();
//IE6下的定位
if (!window.XMLHttpRequest) {
$backToTopEle.css("top", st + winh - 166);
}
};
$(window).bind("scroll", $backToTopFun);
$(function() { $backToTopFun();
});
})();
css:
.backToTop {display: none;width:50px;z-index:1; height:50px;line-height: 1.2;padding:0;background: url(../images/top.gif) 0px 0px #333333;color: #fff;font-size: 12px;
text-align: center;position: fixed;_position: absolute;right: 10px;bottom: 200px;_bottom: "auto";cursor: pointer;opacity: .6; filter: Alpha(opacity=80);}
引出一下疑问:
1.(funciton(){……})(); 什么东东? 与(funciton(){……}());东东?什么关系?
解答:http://www.zhihu.com/question/20292224 知乎的这位大师讲得很好!
解答:http://hi.baidu.com/gaosan15ban/item/d9215162eaf2472268105bd5
http://blog.sina.com.cn/s/blog_4b543e1301017fjl.html
3.以此引发的联想$(function(){...});
这是JQUERY的内置函数,表示网页加载完毕后要执行的意思,和JAVASCRIPT原来的这个是一样的:
window.οnlοad=function(){ //执行函数} 相当于 $(document).ready(function(){ } )
或者:
<body οnlοad="XXX">
也是一个意思。
我的所有的问题解答与联想就此暂告一段,吃饭去……