Question

我有这个滚动的选框，当它只有几个字时效果很好。但是，当我有长文本它不能正常工作时，它不会滚动整个文本。我从右到左滚动页面的页脚。像CNN或FOX那样的滚动条。

C＃，这将获取文本并将其传递给Javascript

        string marquetext = "Lorem ipsum dolor sit amet, a id, turpis non et. Parturient vel sit. Pede duis malesuada, quis dui ut. Ullamcorper nulla, lorem consectetuer odio, aliquet mi.";
        //Passed to Javascript, hidden field.
        hdnParam.Value = marquetext;

Javascript代码

 <script type="text/javascript">

            /*
            Cross browser Marquee script- © Dynamic Drive (www.dynamicdrive.com)
            For full source code, 100's more DHTML scripts, and Terms Of Use, visit http://www.dynamicdrive.com
            Credit MUST stay intact
            */

            //Specify the marquee's width (in pixels)
            var marqueewidth = "2000px"
            //Specify the marquee's height
            var marqueeheight = "100px"
            //Specify the marquee's marquee speed (larger is faster 1-10)
            var marqueespeed = 7
            //configure background color, font color and font size:
            var marqueebgcolor = "#5D7B9D"
            var FontColor = "#FFFFFF"
            var FontSize = "65px"
            //Pause marquee onMousever (0=no. 1=yes)?
            var pauseit = 0

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

            //This hdnParam is obtained from C#
            var marqueecontent = document.getElementById("hdnParam").value;

            ////NO NEED TO EDIT BELOW THIS LINE////////////
            marqueespeed = (document.all) ? marqueespeed : Math.max(1, marqueespeed - 1) //slow speed down by 1 for NS
            var copyspeed = marqueespeed
            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:-9000px">' + marqueecontent + '</span>')
            var actualwidth = ''
            var cross_marquee, ns_marquee

            function populate() {
                if (iedom) {
                    cross_marquee = document.getElementById ? document.getElementById("iemarquee") : document.all.iemarquee
                    cross_marquee.style.left = parseInt(marqueewidth) + 8 + "px"
                    cross_marquee.innerHTML = marqueecontent
                    actualwidth = document.all ? temp.offsetWidth : document.getElementById("temp").offsetWidth
                }
                else if (document.layers) {
                    ns_marquee = document.ns_marquee.document.ns_marquee2
                    ns_marquee.left = parseInt(marqueewidth) + 8
                    ns_marquee.document.write(marqueecontent)
                    ns_marquee.document.close()
                    actualwidth = ns_marquee.document.width
                }
                lefttime = setInterval("scrollmarquee()", 20)
            }
            window.onload = populate

            function scrollmarquee() {
                if (iedom) {
                    if (parseInt(cross_marquee.style.left) > (actualwidth * (-1) + 8))
                        cross_marquee.style.left = parseInt(cross_marquee.style.left) - copyspeed + "px"
                    else
                        cross_marquee.style.left = parseInt(marqueewidth) + 8 + "px"
                }
                else if (document.layers) {
                    if (ns_marquee.left > (actualwidth * (-1) + 8))
                        ns_marquee.left -= copyspeed
                    else
                        ns_marquee.left = parseInt(marqueewidth) + 8
                }
            }

            if (iedom || document.layers) {
                with (document) {
                    document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
                    if (iedom) {
                        write('<div style="position:relative;width:' + marqueewidth + ';height:' + marqueeheight + ';overflow:hidden">')
                        write('<div style="position:absolute;width:' + marqueewidth + ';height:' + marqueeheight + ';background-color:' + marqueebgcolor + ';Color:' + FontColor + ';font-size:' + FontSize + '" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
                        write('<div id="iemarquee" style="position:absolute;left:0px;top:0px"></div>')
                        write('</div></div>')
                    }
                    else if (document.layers) {
                        write('<ilayer width=' + marqueewidth + ' height=' + marqueeheight + ' name="ns_marquee" bgColor=' + marqueebgcolor + '>')
                        write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
                        write('</ilayer>')
                    }
                    document.write('</td></table>')
                }
            }
        </script>

Answer 1

这段代码有点过时，我建议查看jQuery选框插件（只是谷歌“jQuery选框”），例如你可以使用这个：http://remysharp.com/demo/marquee.html

在Javascript中滚动字幕不能正常工作

1 个答案: