Question

我正在使用这个javascript来使图像从底部垂直滚动到顶部，但我无法弄清楚如何在框架填充时使图像开始滚动。现在，当网站/脚本加载时它是空的，我想改变它。

谢谢！（我很抱歉长代码）

以下是代码：

<script>

step = 1
nextMessage = 1

counter = 20;

function initTSV1() {
    tsvDisplay = document.getElementById("tsvcont")

    for (var i = 0; i < 2; i++) {
        newDiv = document.createElement("DIV")
        newDiv.setAttribute("id", "tsvdiv" + i)

/*newDiv.onmouseover=function(){
    clearTimeout(timer);
    counter = 40;
}

newDiv.onmouseout=function(){
    counter = 20;
    scrollTSV1();
}*/

        newDiv.style.position = "absolute"
        newDiv.style.padding = "0 5 0 10" // top right bottom left
        tsvDisplay.appendChild(newDiv)
    }

    tsvDv0 = document.getElementById("tsvdiv0")
    tsvDv1 = document.getElementById("tsvdiv1")
    tsvDv0.innerHTML = info[0]
    tsvDv1.innerHTML = info[1]

    tsvDv0.style.top = tsvDisplay.offsetHeight
    tsvDv1.style.top = tsvDisplay.offsetHeight + tsvDv0.offsetHeight + "px"

    scrollTSV1()
}

function scrollTSV1() {

/*$("#tsvcont").mouseover(function() {
    counter = 40;

}).mouseout(function() {
    counter = 20;
});*/


    $("#tsvcont").mouseout(function() {
        counter = 20;
    }).mouseover(function() {
        counter = 40;
    });



    tsvDv0Pos = parseInt(tsvDv0.style.top)
    tsvDv1Pos = parseInt(tsvDv1.style.top)

    tsvDv0Pos -= step
    tsvDv1Pos -= step

    tsvDv0.style.top = tsvDv0Pos + "px"
    tsvDv1.style.top = tsvDv1Pos + "px"

    if (tsvDv0Pos < -tsvDv0.offsetHeight) {

        nextMessage++
        if (nextMessage == info.length) {
            nextMessage = 0
        }
        tsvDv0.innerHTML = info[nextMessage]

        if (tsvDv1.offsetHeight < tsvDisplay.offsetHeight) {

            if (tsvDv1.offsetTop < tsvDisplay.offsetHeight - tsvDv1.offsetHeight) {
                tsvDv0.style.top = tsvDisplay.offsetHeight + "px"
            }
            else {
                tsvDv0.style.top = tsvDv1.offsetTop + tsvDv1.offsetHeight + "px"
            }

        }
        else {
            tsvDv0.style.top = tsvDv1.offsetTop + tsvDv1.offsetHeight + "px"
        }

    }

    if (tsvDv1Pos < -tsvDv1.offsetHeight) {

        nextMessage++
        if (nextMessage == info.length) {
            nextMessage = 0
        }
        tsvDv1.innerHTML = info[nextMessage]

        if (tsvDv0.offsetHeight < tsvDisplay.offsetHeight) {

            if (tsvDv0.offsetTop < tsvDisplay.offsetHeight - tsvDv0.offsetHeight) {
                tsvDv1.style.top = tsvDisplay.offsetHeight + "px"
            }
            else {
                tsvDv1.style.top = tsvDv0.offsetTop + tsvDv0.offsetHeight + "px"
            }

        }
        else {
            tsvDv1.style.top = tsvDv0.offsetTop + tsvDv0.offsetHeight + "px"
        }

    }

    timer = setTimeout("scrollTSV1()", counter);

}

// add onload="initTSV1()" to the opening BODY tag

</script>

<style>

#tsvcont{
    position:relative;
    width:290px;          /* width = target width - (border * 2) */
    height:500px;
    overflow:hidden;
    text-align:left;
}

#tsvdiv0 {
    position:absolute;
    width:290px;          /* width = tsvcont width - ((border + padding) * 2) */
    padding:0px 0px 30px 0px;
    height:600px;

}
#tsvdiv1{
    position:relative;
    width:290px;          /* width = tsvcont width - ((border + padding) * 2) */
    padding:30px 5 0px 5;
    height:600px;

    }
</style>


</HEAD>
<BODY onLoad="initTSV1()">
<DIV id="tsvcont" style="position:relative; width:290px; height:500px; overflow:hidden; text-align:left; left: 50px";></DIV>

Answer 1

而不是将函数放在正文卸载中，因为你正在使用jQuery

试试这个：

$(function(){
   initTSV1();
});

把它放在脚本中的某个地方

如何让内容从中间/顶部开始而不是从底部开始？

1 个答案: