javascript - 类似 Tumblr 的页脚

Question

当你在 Tumblr 上启用无限滚动时，当你将鼠标放在仪表板底部时，页脚会淡入。我如何将这种技术用于我的网站？

Answer 1

如果您使用 jQuery 库，那将非常容易。

假设您有以下带有自定义样式的 id="footer"的页脚 div

<div id="footer" style="position:fixed;bottom:0px;left:0px;margin:0px;width:100%;opacity:0.001">
    <center>StackOverflow | About US | Privacy | Blah Blah Blah | Something </center>
</div>

然后添加下面的java脚本

<script type="text/javascript">
   $(document).ready(function() { 
    $('#footer').hover(
        function(){
            $(this).stop().fadeTo('slow',1);
        },
        function(){
            $(this).stop().fadeTo('slow',0.001);
        });

    });
</script>

确保您已经包含了 jQuery 库，如果没有，只需将以下行添加到您的 Head 部分:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>