在HTML上运行两个脚本(Javascript)

时间:2013-11-04 14:06:34

标签: javascript html

我正在学习Java Script,我在网上找到了一个用于滚动文本的免费脚本。 我的目标是在一个页面上多次使用它,但我不能再使用它一次并使其工作,我希望你能提供帮助。 这是HTML:

<head>
    <meta charset="utf-8" />
    <title>Scrollers</title>
</head>
<body style="background-color:#3c3c3c">
    <br />
    <script type="text/javascript" src="d:(...)\my documents\visual studio 2013\Projects\scrolling text\scroller 1.js"></script>
    <br />
    <script type="text/javascript" src="d:(...)\my documents\visual studio 2013\Projects\scrolling text\scroller 2.js"></script>
</body>

我的Java脚本脚本:

var memorywidth = "1850px" //scroller width
var memoryheight = "140px" //scroller height
var memorybgcolor = "#000000" //scroller background
var memorypadding = "5px" //padding applied to the scroller. 0 for non.
var borderCSS = "border: 1px solid black;" //Border CSS, applied to scroller to give border.

var memoryspeed = 5 //Scroller speed (larger is faster 1-10)
var pauseit = 1 //Pause scroller onMousever (0=no. 1=yes)?

var persistlastviewedmsg = 1 //should scroller's position persist after users navigate away (1=yes, 0=no)?
var persistmsgbehavior = "onload" //set to "onload" or "onclick".

//Specify the scroller's content (don't delete <nobr> tag)
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

var memorycontent = '<span style="color: #FFFFFF; font-family: Consolas; font-size:120px"><strong style="color:#B54646">04-11-2013</strong> - \
            FTs de alta dentro do SLA: 89% <img src="http://imageshack.com/a/img18/9017/uz2b.png" height="100" width="70">;\
            FTs de alta fora do SLA: 12% <img src="http://imageshack.com/a/img18/9017/uz2b.png" height="100" width="70">;\
            FTs de alta em TNE: 92% <img src="http://imageshack.com/a/img585/9553/1sgm.png" height="100" width="70">;\
            FTs de alta em TNO: 99% <img src="http://imageshack.com/a/img18/9017/uz2b.png" height="100" width="70">;\
            FTs de alta em TCO: 73% <img src="http://imageshack.com/a/img585/9553/1sgm.png" height="100" width="70">;\
            </span>'


////NO NEED TO EDIT BELOW THIS LINE////////////
var combinedcssTable = "width:" + (parseInt(memorywidth) + 6) + "px;background-color:" + memorybgcolor + ";padding:" + memorypadding + ";" + borderCSS + ";"
var combinedcss = "width:" + memorywidth + ";height:" + memoryheight + ";"

var divonclick = (persistlastviewedmsg && persistmsgbehavior == "onclick") ? 'onClick="savelastmsg()" ' : ''
memoryspeed = (document.all) ? memoryspeed : Math.max(1, memoryspeed - 1) //slow speed down by 1 for NS
var copyspeed = memoryspeed
var pausespeed = (pauseit == 0) ? copyspeed : 0
var iedom = document.all || document.getElementById
if (iedom)
    document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-10000px">' + memorycontent + '</span>')
var actualwidth = ''
var memoryscroller

if (window.addEventListener)
    window.addEventListener("load", populatescroller, false)
else if (window.attachEvent)
    window.attachEvent("onload", populatescroller)
else if (document.all || document.getElementById)
    window.onload = populatescroller

function populatescroller() {
    memoryscroller = document.getElementById ? document.getElementById("memoryscroller") : document.all.memoryscroller
    memoryscroller.style.left = parseInt(memorywidth) + 8 + "px"
    if (persistlastviewedmsg && get_cookie("lastscrollerpos") != "")
        revivelastmsg()
    memoryscroller.innerHTML = memorycontent
    actualwidth = document.all ? temp.offsetWidth : document.getElementById("temp").offsetWidth
    lefttime = setInterval("scrollmarquee()", 20)
}

function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = ""
    if (document.cookie.length > 0) {
        offset = document.cookie.indexOf(search)
        if (offset != -1) {
            offset += search.length
            end = document.cookie.indexOf(";", offset)
            if (end == -1)
                end = document.cookie.length;
            returnvalue = unescape(document.cookie.substring(offset, end))
        }
    }
    return returnvalue;
}

function savelastmsg() {
    document.cookie = "lastscrollerpos=" + memoryscroller.style.left
}

function revivelastmsg() {
    lastscrollerpos = parseInt(get_cookie("lastscrollerpos"))
    memoryscroller.style.left = parseInt(lastscrollerpos) + "px"
}

if (persistlastviewedmsg && persistmsgbehavior == "onload")
    window.onunload = savelastmsg

function scrollmarquee() {
    if (parseInt(memoryscroller.style.left) > (actualwidth * (-1) + 8))
        memoryscroller.style.left = parseInt(memoryscroller.style.left) - copyspeed + "px"
    else
        memoryscroller.style.left = parseInt(memorywidth) + 8 + "px"
}

if (iedom) {
    with (document) {
        document.write('<table border="0" cellspacing="0" cellpadding="0" style="' + combinedcssTable + '"><td>')
        write('<div style="position:relative;overflow:hidden;' + combinedcss + '" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=memoryspeed">')
        write('<div id="memoryscroller" style="position:absolute;left:0px;top:0px;" ' + divonclick + '></div>')
        write('</div>')
        document.write('</td></table>')
    }
}

所以我尝试更改变量,但所有变量都没有效果。 我希望你能帮忙!

谢谢!

2 个答案:

答案 0 :(得分:2)

您不应该包括两次脚本调用,即使您想要两次运行滚动条,也可能多次运行,您应该只调用一次脚本。发布此信息时,只要您想使用滚动条,就应该使用事件调用方法。您应该使用onSubmit / onblur等方法调用绑定事件。

答案 1 :(得分:1)

如果你正在学习javascript,你应该学习所有这些功能的确切功能。

这个脚本确实两次使用SOME标识符。所以可能的情况是:函数名,var名和html dom id。

如果你想学习javascript,你应该明确地检查这个东西是如何工作的并自己动手。此外,这是一些preeetty坏代码。您永远不应该在javascript文件中定义网站的内容

给你一点启动:

lefttime = setInterval("scrollmarquee()", 20)

此行设置计时器。 scrollmarquee()在20毫秒内被调用。

memoryscroller.style.left = someVar

此行设置左侧的CSS样式。哪个是内存卷轴的位置。你可以增加这个位置来实现滚动效果。

这里有一些你需要完成你想要做的事情的心态: 您可以在开头调用一次scrollmarquee。然后增加滚动元素的位置。然后使用scrollmarquee再次调用“setInterval”方法。因此,scrollmarquee每20毫秒调用一次。