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. 自己封装的Windows7 64位旗舰版，微软官网上下载的Windows7原版镜像制作，绝对纯净版

    MSDN官网上下载的Windows7 64位 旗舰版原版镜像制作,绝对纯净版,无任何精简,不捆绑任何第三方软件.浏览器插件,不含任何木马.病毒等. 集成: 1.Office2010 2.DirectX ...

  2. 纯CSS3实现动态火车行驶特效

    上次开完飞机,这次开火车 查看效果:http://hovertree.com/texiao/css3/7/ 效果图: 代码如下: <!DOCTYPE html> <html> ...

  3. 基于CkEditor实现.net在线开发之路（8）Vs开发怎么配置

    前段时间有一园友问我,怎么将组件放置到VS开发工具的工具箱中,用vs开发工具配合CKEditor实现在线.net开发呢? 第一步:登陆http://www.zjt-lab.com:8090/login ...

  4. 使用js批量选中功能实现更改数据库中的status状态值（批量展示）

    我们在开发项目的时候经常会在后台管理时用到批量展示功能来动态的修改数据库的值.下面以修改数据库的status状态值来实现批量展示功能.批量选中功能引用js来实现.前端html代码: <table ...

  5. 从零开始学Python07作业源码：虚拟人生（仅供参考）

    bin目录: Simulated_life_start.py #!usr/bin/env python # -*- coding:utf-8 -*- # auther:Mr.chen # 描述: im ...

  6. 从零开始学 Java - Windows 下安装 JDK

    关于未来 "我要死在火星.在我死去的时候能够想着人类能有一个美好的未来--有可持续的能源,同时能够殖民其他的星球来避免人类灭绝的最坏可能." 官网下载 直接打开官网:http:// ...

  7. DDD开发框架ABP之本地化资源的数据库存储扩展

    在上一篇<DDD开发框架ABP之本地化/多语言支持>中,我们知道,ABP开发框架中本地化资源存储可以采用XML文件,RESX资源文件,也提供了其他自定义的存储方式的扩展接口.ABP框架默认 ...

  8. IE8，IE10下载的临时文件到哪里去了？？？

    操作攻略: 打开IE浏览器=>工具=>Internet选项=>常规选项卡中,找到"浏览历史记录"=>设置,然后就可看到"当前位置"所列出 ...

  9. eclipse Swt编程—窗口小部件widget

    1.标签Label // 标签(Label类)组件是SWT中最简单的组件.Label类的构造方法和格式如下: // Label(Composite parent,

  10. SharePoint 2013 自定义扩展菜单

    在对SharePoint进行开发或者功能扩展的时候,经常需要对一些默认的菜单进行扩展,以使我们开发的东西更适合SharePoint本身的样式.SharePoint的各种功能菜单,像网站设置.Ribbo ...