618要到了.要帮公司做一个简单的中奖号码的浮动.怎么玩了。其实只需要使用scrollHeight;scrollTop;offsetHeight这三个就可以实现了.

代码如下:

<html>

    <meta charset='utf-8'>

    <body>

        <div id="demo" style="overflow:hidden;height:92px;width:232;border:1px,solid">

                <ul>

                    <li>第一行</li>

                    <li>第二行</li>

                    <li>第三行</li>

                    <li>第四行</li>

                    <li>第五行</li>

                    <li>第六行</li>

                    <li>第七行</li>

                    <li>第八行</li>

                    <li style='list-style-type:none'>&nbsp;</li>

                    <li style='list-style-type:none'>&nbsp;</li>

                    <li style='list-style-type:none'>&nbsp;</li>

                    <li style='list-style-type:none'>&nbsp;</li>

                </ul>

     <div id="demo2"></div>

    </div>

    </body> 

   <script>

            var demo = document.getElementById('demo');

            var roll = function(target){

                if(target.scrollTop < target.scrollHeight - target.offsetHeight){

                    target.scrollTop++;

                }else{

                    target.scrollTop = ;

                }

            }

            setInterval('roll(demo)',);

   </script>

</html>

JS--中奖广告浮动效果的更多相关文章

  1. Jquery广告浮动效果小案例

    导入<script src="<%=path%>/html5/js/jquery.js"></script>文件 <SCRIPT type ...

  2. Javascript 广告浮动效果在浏览器中间N秒后移动到右下角

    Javascript 广告浮动效果在浏览器中间N秒后移动到右下角 闲着无聊做了一个,本人原创...就是这个页面的广告效果....怎么样???? 刚刚学习的javascript

  3. js广告浮动

    一个广告框在指定区域,有定位属性的父级区域内,一直向右向左移动,如果碰到左右边框,反向,如果碰到上下边距,反向,实现在指定框中浮动的效果. <!doctype html> <html ...

  4. JS使用cookie实现只出现一次的广告代码效果

    我们上网经常会遇到第一次需要登录而之后不用再登录的网站的情况,其实是运用了Cookie 存储 web 页面的用户信息,Cookie 以名/值对形式存储,当浏览器从服务器上请求 web 页面时, 属于该 ...

  5. 一个Banner广告收缩效果

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

  6. javascript 表格排序和表头浮动效果(扩展SortTable)

    前段时间一个项目有大量页面用到表格排序和表头浮动的效果,在网上找了几个表格排序的js代码,最后选择了 Stuart Langridge的SortTable,在SortTable基础上做了些扩展,加上了 ...

  7. [Swift通天遁地]八、媒体与动画-(3)实现视频播放的水印、Overlay、暂停时插入广告等效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  8. 广告投放效果难判断？集成华为DTM为您轻松实现！

    在进行广告投放时,你是否遇到这样的困扰: 花了一大笔预算去投放推广,不知道实际效果如何? 用户看到投放的广告,产生了哪些有价值的行为? 当前广告投放的渠道和类型等投放策略,是否需要调整? 此时我们就需 ...

  9. 原生JS封装简单动画效果

    原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...

随机推荐

  1. 关系数据库SQL之高级数据查询:去重复、组合查询、连接查询、虚拟表

    前言 接上一篇关系数据库SQL之基本数据查询:子查询.分组查询.模糊查询,主要是关系型数据库基本数据查询.包括子查询.分组查询.聚合函数查询.模糊查询,本文是介绍一下关系型数据库几种高级数据查询SQL ...

  2. ASP.NET MVC过滤器

    在ASP.NET MVC中有个重要特性就是过滤器,使得我们在MVC程序开发中更好的控制浏览器请求的URL,不是每个请求都有响应内容,只有特定得用户才有.园子里关于过滤器的资料也有很多,这篇文章主要是记 ...

  3. 【Win10开发】如何在页面之间传值

    我们知道UWP是通过不同的页面来展示不同的内容的,那么我们该怎么进行页面之间的传值呢? 首先我们在MainPage里面写一个ListView来展示一些英文单词. List<English> ...

  4. Hibernate框架中Criteria语句

    在Hibernate中有一种查询语句是Criteria查询(QBC查询),今天呢 我们就一个个的详细的跟大家一起探讨Criteria语句的相关知识点 案例前的准备 //插入测试数据,构建数据库 pub ...

  5. C# 常用加密解密帮助类

    public static class EncryptUtil { #region MD5加密 /// <summary> /// MD5加密 /// </summary> p ...

  6. 【C#】可空类型(Nullable)

    C# 可空类型(Nullable) C# 提供了一个特殊的数据类型,nullable 类型(可空类型),可空类型可以表示其基础值类型正常范围内的值,再加上一个 null 值. 例如,Nullable& ...

  7. PHP json字符串，格式化缩进显示

    PHP json字符串,格式化显示 /** * 格式化 */ class JsonFormatHelper { /** * json字符串缩进显示 * @param unknown $json * @ ...

  8. Java Web项目RSA加密

    最近做的一个项目,服务器为Java,采用SSH框架,客户端为Android和IOS.当用户登录时,从客户端向服务器提交用户名和密码.这就存在一个问题,如果数据包在网络上被其他人截取了,密码就有可能泄露 ...

  9. python之进程与线程

    什么是操作系统       可能很多人都会说,我们平时装的windows7 windows10都是操作系统,没错,他们都是操作系统.还有没有其他的? 想想我们使用的手机,Google公司的Androi ...

  10. laravel 使用artisan命令新增数据库字段

    php artisan make:migration create_comments_table <?php use Illuminate\Database\Schema\Blueprint; ...