WordPress 中的可滚动浮动图像

Question

我想实现一个浮动图像，当用户滚动页面时它会向上/向下滚动。

我在 google 上搜索了一段在练习板上表现出色的代码，但是当我将其插入到我的 Wordpress footer.php 中（按照指示就在 end-body-tag 之前）时，它就放在那里并且当我滚动时不会滚动...

代码如下：

<script>

if (!document.layers)

document.write('<div id="divStayTopLeft" style="position:absolute">')

</script>

<layer id="divStayTopLeft">

<!--EDIT BELOW CODE TO YOUR OWN MENU-->

<a href="google.ca"><img src="http://nailian.ca/wp-content/uploads/misc/coupon.png"></a>

<!--END OF EDIT-->

</layer>


<script type="text/javascript">

//Enter "frombottom" or "fromtop"
var verticalpos="fromtop"

if (!document.layers)
document.write('</div>')

function JSFX_FloatTopDiv()

{

    var startX = 3,

    startY = 150;

    var ns = (navigator.appName.indexOf("Netscape") != -1);

    var d = document;

    function ml(id)

    {

        var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];

        if(d.layers)el.style=el;

        el.sP=function(x,y){this.style.left=x;this.style.top=y;};

        el.x = startX;

        if (verticalpos=="fromtop")

        el.y = startY;

        else{

        el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;

        el.y -= startY;

        }

        return el;

    }

    window.stayTopLeft=function()

    {

        if (verticalpos=="fromtop"){

        var pY = ns ? pageYOffset : document.body.scrollTop;

        ftlObj.y += (pY + startY - ftlObj.y)/8;

        }

        else{

        var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;

        ftlObj.y += (pY - startY - ftlObj.y)/8;

        }

        ftlObj.sP(ftlObj.x, ftlObj.y);

        setTimeout("stayTopLeft()", 10);

    }

    ftlObj = ml("divStayTopLeft");

    stayTopLeft();

}

JSFX_FloatTopDiv();

</script>

链接将位于此处： http://nailian.ca/

Answer 1

我认为 css 样式 position:fixed 正是您所需要的。

这是一个示例。