<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>upRoll</title>

</head>

<body>

<style type="text/css">

body{margin:0px auto; padding:0px;}

ul,li{margin:0px; padding:0px;list-style:none;}

.scroll_div {width:180px; height:109px; border:1px solid #96C; margin:0 auto; overflow: hidden; white-space: nowrap; background:#ffffff;}

.scroll_div div{ height:110px;}

</style>

<!--#####滚动区_begin域#####-->

<div style="text-align:center">

    <div id="scroll_div" class="scroll_div">

        <div>

            <ul>

                <li>aaaaaaaaaaaaaaaaaaaaa</li>

                <li>bbbbbbbbbbbbbbbbbbbbb</li>

                <li>ccccccccccccccccccccc</li>

                <li>ddddddddddddddddddddd</li>

                <li>eeeeeeeeeeeeeeeeeeeee</li>

                <li>fffffffffffffffffffff</li>

            </ul>

        </div>

        <div></div>

    </div>

</div>

<div style="height:10px;"></div>

<div style="text-align:center">

    <div id="scroll_diy" class="scroll_div">

        <div>

            <ul>

                <li>ggggggggggggggggggggg</li>

                <li>hhhhhhhhhhhhhhhhhhhhh</li>

                <li>iiiiiiiiiiiiiiiiiiiii</li>

                <li>jjjjjjjjjjjjjjjjjjjjj</li>

                <li>kkkkkkkkkkkkkkkkkkkkk</li>

                <li>lllllllllllllllllllll</li>

            </ul>

        </div>

        <div></div>

    </div>

</div>

<!--#####滚动区域_end#####-->

<script type="text/javascript">

function upRoll(obj,myMar,speed){

    var scroll_obj = document.getElementById(obj);

    var scroll_beg = scroll_obj.getElementsByTagName('div').item(0);

    var scroll_end = scroll_obj.getElementsByTagName('div').item(1);

    scroll_end.innerHTML = scroll_beg.innerHTML;

    var marquee = function(){

        if(scroll_end.offsetHeight - scroll_obj.scrollTop <= 0 ){

            scroll_obj.scrollTop -= scroll_beg.offsetHeight;

        }else{

            scroll_obj.scrollTop++;

        }

    }

    myMar = setInterval(marquee,speed);

    scroll_obj.onmouseover = function(){clearInterval(myMar);}

    scroll_obj.onmouseout  = function(){myMar = setInterval(marquee,speed);}

}

upRoll('scroll_div','sd',50);

upRoll('scroll_diy','se',20);

</script>

</body>

</html>

寫法2

function faqDTScroll(id,w,n){

    var box=document.getElementById(id),can=true,w=w||100,fq=fq||10,n=n==-1?-1:1;

    box.innerHTML  += box.innerHTML;

    box.onmouseover = function(){can=false};

    box.onmouseout  = function(){can=true};

    var max = parseInt(box.scrollHeight/2);

    new function (){

        var stop = box.scrollTop%20==0&&!can;

        if(!stop){

            var set = n > 0 ? [max,0] : [0,max];

            box.scrollTop==set[0]?box.scrollTop=set[1]:box.scrollTop+=n;

        };

        setTimeout(arguments.callee,box.scrollTop%20?fq:w);

    };

}
faqDTScroll('dtscrollID',2000);

javascript內容向上不間斷滾動的更多相关文章

  1. VB.Net DataSet 填充資料庫內容

    '導入命名空間Imports System.Data.OleDb '定義變量 Dim ds As DataSet = New DataSet() Dim i, cn As Integer Dim Sq ...

  2. [jQuery] 使用jQuery printPage plugin打印其他頁面內容

    目標: 點選按鈕後可以打印其他頁面的內容,可用於套版.內部表單套印...等等. 程式碼: 1.View(HTML布局) <h2>維修申請單</h2> <form id=& ...

  3. 利用ASP.NET AJAX的Timer讓GridView每隔一段時間做到自動換頁的功能

    最近在討論區看到這個問題,小弟利用asp.net ajax的timer來實作這個功能 利用timer每隔一段時間,讓gridview自動跳頁並且更新gridview的內容 asp.net(c#) Gr ...

  4. Jquery scrollTop animate 實現動態滾動到頁面頂部

    這個方法之前都是用的錨點實現的,但是效果僵硬,動感不足! 之後參考了一些網站,發現都是用的js,於是自己想到用jquery 來做一個插件也來實現以下這個小功能. $.fn.backTop = func ...

  5. [原] XAF 如何啟用ListView橫向滾動條

    using System; using DevExpress.ExpressApp; using DevExpress.ExpressApp.Win.Editors; using DevExpress ...

  6. 使用JavaScript完成文字向上间歇滚动

    使用JavaScript完成文字的间歇滚动 const init = (initData) => { const area = initData.area; // 设置单行滚动的高度: cons ...

  7. JS動態綁定下拉單內容

    function req00_Line1_onChange(obj) {     //if ($(obj).val() != "" && $(obj).val() ...

  8. .NET中通過OUTLOOK發送附件內容

    最近碰到一個發送郵件附件的問題,隨便幾下來,方便以後學習. string[] files = System.IO.Directory.GetFiles(@"~/UploadData" ...

  9. MVC 下拉單數據內容綁定

    #region        /// <summary>授權範圍自建列表</summary>        /// <returns></returns> ...

随机推荐

  1. /root/.bashrc与/etc/profile的异同

    要搞清bashrc与profile的区别,首先要弄明白什么是交互式shell和非交互式shell,什么是loginshell 和non-loginshell. 交互式模式就是shell等待你的输入,并 ...

  2. .net中XML的创建02（linqToXml）

    linqToXml比较的灵活和方便,它是基于函数式编程具体的使用如下:引用程序集using System.Xml.Linq; 1.创建XDocument并设置文档头  XDocument XDoc = ...

  3. Puer是一个可以实时编辑刷新的前端服务器

    ##Puer是一个可以实时编辑刷新的前端服务器 确保你安装了nodejs(现在还有没nodejs环境的前端? 拖出去喂狗吧) 使用npm全局安装puer命令 npm install puer -g 输 ...

  4. 【USACO 3.1.2】总分

    [描述] 学生在我们USACO的竞赛中的得分越多我们越高兴.我们试着设计我们的竞赛以便人们能尽可能的多得分,这需要你的帮助.我们可以从几个种类中选取竞赛的题目,这里的一个"种类"是 ...

  5. JavaScript 框架比较

    显著增强 JavaScript 开发的框架概览 Joe Lennon, 软件开发人员, 自由职业者 简介: 现代 Web 站点和 Web 应用程序倾向于依赖大量客户端 JavaScript 来提供丰富 ...

  6. Python学习6.1_函数参数及参数传递

    大多数编程语言都绕不开一个名词,那就是--函数(function).而函数很重要的部分则是参数(arguments)的使用.Python的参数传递总体来说是根据位置,传递对应的参数.阐述如下: 1.位 ...

  7. connect函数

    TCP客户用connect函数来建立与TCP服务器的连接 int connect (int sockfd, const sockaddr * servaddr, socklen_t addrlen); ...

  8. 一个md5加密的工具类，用的虚拟机的包，不需要额外导包

    package com.yun.park.service.utils;import org.slf4j.Logger;import org.slf4j.LoggerFactory;import jav ...

  9. codevs 1017 乘积最大

    1017 乘积最大 2000年NOIP全国联赛普及组NOIP全国联赛提高组  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描 ...

  10. SegmentReader 批量 dump

    /** * Licensed to the Apache Software Foundation (ASF) under one or more * contributor license agree ...