开发者

scrollable floaty image in wordpress

开发者 https://www.devze.com 2023-04-05 21:29 出处:网络
I want to implement a floating image that would scroll up/down when the user scrolls the page. I googled up a code that works awesome in a practice board, but when I insert it (just right before the

I want to implement a floating image that would scroll up/down when the user scrolls the page.

I googled up a code that works awesome in a practice board, but when I insert it (just right before the end-body-tag as instructed) in my Wordpress footer.php, it just sits there and won't scroll as I scroll...

The code is as follows:

<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>

A link would be here : http://nailian.ca/


I think the css style position: fixed is what you need here.

Here's an example.

0

精彩评论

暂无评论...
验证码 换一张
取 消