代码之家 › 专栏 › 技术社区 › Daniel

用javascript显示新闻

scroll javascript

Daniel · 技术社区 · 15 年前

我一直在想这个问题。在网站上显示新闻。我想提出一个像模板一样使用的解决方案,我可以很容易地放到一个网站上。

我一直看到的解决方案是一个带javascript的iframe来滚动内容。但是,我真的反对使用iframes的想法,我认为使用iframes的时间已经过去了。

我想在没有框架的情况下使用JS,因为它不允许使用其他框架。有人知道我在哪里能找到强壮的东西吗?

( 我正在考虑使用垂直滚动,但我也很好奇其他的解决方案 )

2 回复 | 直到 7 年前

Daniel 15 年前

我找到了一个对我来说很好的剧本,也许其他人会觉得这很有用

/***********************************************
* Cross browser Marquee II- Â© Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

var delayb4scroll=1000; //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var marqueespeed=1; //Specify marquee scroll speed (larger is faster 1-10)
var pauseit=1; //Pause marquee onMousever (0=no. 1=yes)?
var tim;
////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=marqueespeed;
var pausespeed=(pauseit==0)? copyspeed: 0;
var actualheight='';

function scrollmarquee(){
    //document.write(parseInt(cross_marquee.style.top));
        //if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) {
    if (document.getElementById('track').value == "") {
        if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) {
            cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px";
            //alert(actualheight);
        }
        else {
            //alert(parseInt(marqueeheight));
            cross_marquee.style.top=parseInt(marqueeheight)-8+"px";
        }
    }
}

//on mouse out
function mouse_out() {
    clearTimeout(tim);
    scrollmarquee;
}

//init()
function initializemarquee(){
    cross_marquee=document.getElementById("vmarquee");
    cross_marquee.style.top=0;
    marqueeheight=document.getElementById("marqueecontainer").offsetHeight;
    actualheight=cross_marquee.offsetHeight;
    if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit
        cross_marquee.style.height=marqueeheight+"px";
        cross_marquee.style.overflow="scroll";
        return
    }
    setTimeout('lefttime=setInterval("scrollmarquee()",55)', delayb4scroll);
}

//event listener
if (window.addEventListener) {
    window.addEventListener("load", initializemarquee, false);
}
else if (window.attachEvent) {
    window.attachEvent("onload", initializemarquee);
}
else if (document.getElementById) {
    window.onload=initializemarquee;
}

HTML:

<!-- scroll -->
<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">
<div id="vmarquee" class="vmarquee_content">
    <!--YOUR SCROLL CONTENT HERE-->
</div>
</div>
<input id="track" name="track" type="hidden" value="">

CSS:

#marqueecontainer{
    position: relative;
    width: 250px; /*marquee width */

    height: 150px; /*marquee height */
    background-color: white;
    overflow: hidden;
    border: 1px solid #666666;
    padding: 2px;
    padding-left: 4px;
}
.scroll_div {
    border:solid 1px #3366FF;
    width: 260px;
    width/**/: 280px !important;
}
.vmarquee_content {
    position:absolute;
    font-size:12px;
    font-family:Arial, Helvetica, sans-serif;
}

Vadim Kotov First Zero 7 年前

为什么不取一个DIV,插入另一个DIV,给第二个DIV一个连续的顶值。

<script type="text/javascript">
function toTop(top_value)
{
  if (top_value == 0)
  { document.getElementById('news').css.top = '0'; }

  document.getElementById('news').css.top = '-5px';
}
window.setTimeout('toTop(1)', 100);
window.setTimeout('toTop(0)', 10000);
</script>

这是未经测试的,但我是这样做的。