MooTools 页面滚动浮动层智能定位实现代码

160 阅读 0 评论 106 点赞

我是靠谱客的博主喜悦金鱼，最近开发中收集的这篇文章主要介绍MooTools 页面滚动浮动层智能定位实现代码，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

HTML代码：

复制代码代码如下:

 
<div class="float" id="float"> 
我是个腼腆羞涩的浮动层... 
</div> 

JS代码：

复制代码代码如下:

 
var $smartFloat = function(elements) { 
var position = function(element) { 
var top = element.getPosition().y, pos = element.getStyle("position"); 
window.addEvent("scroll", function() { 
var scrolls = this.getScroll().y; 
if (scrolls > top) { 
if (window.XMLHttpRequest) { 
element.setStyles({ 
position: "fixed", 
top: 0 
}); 
} else { 
element.setStyles({ 
top: scrolls 
}); 
} 
}else { 
element.setStyles({ 
position: "absolute", 
top: top 
}); 
} 
}); 
}; 
if ($type(elements) === "array") { 
return elements.each(function(items) { 
position(items); 
}); 
} else if ($type(elements) === "element") { 
position(elements); 
} 
}; 

//绑定 
$smartFloat($("float")); 