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. [Excel] Worksheet.PasteSpecial

    PasteSpecial(Format, Link, DisplayAsIcon, IconFileName, IconIndex, IconLabel, NoHTMLFormatting) 1. F ...

  2. .net中创建xml文件的两种方法

    .net中创建xml文件的两种方法 方法1:根据xml结构一步一步构建xml文档,保存文件(动态方式) 方法2:直接加载xml结构,保存文件(固定方式) 方法1:动态创建xml文档 根据传递的值,构建 ...

  3. 第 31 章 项目实战-PC 端固定布局[3]

    学习要点: 1.搜索区 2.插入大图 3.搜索框 主讲教师:李炎恢 本章主要开始使用学习用 HTML5 和 CSS3 来构建 Web 页面,第一个项目采用 PC 端固定布局来实现. 一．搜索区 本节课 ...

  4. Java程序员应该知道的10个调试技巧

    试可以帮助识别和解决应用程序缺陷,在本文中,作者将使用大家常用的的开发工具Eclipse来调试Java应用程序.但这里介绍的调试方法基本都是通用的,也适用于NetBeans IDE,我们会把重点放在运 ...

  5. 12、ASP.NET MVC入门到精通——HtmlHelper

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 HtmlHelper:是为了方便View的开发而产生 HtmlHelper的演变 普通首页超级链接为:<a href="/h ...

  6. ASP.NET MVC搭建项目后台UI框架—7、统计报表

    ASP.NET MVC搭建项目后台UI框架—1.后台主框架 ASP.NET MVC搭建项目后台UI框架—2.菜单特效 ASP.NET MVC搭建项目后台UI框架—3.面板折叠和展开 ASP.NET M ...

  7. 使用javascript生成的植物显示过程特效

    查看效果:http://keleyi.com/keleyi/phtml/html5/33.htm .NET版本:http://keleyi.com/a/bjac/66mql4bc.htm 完整HTML ...

  8. AngularJS Directive 隔离 Scope 数据交互

    什么是隔离 Scope AngularJS 的 directive 默认能共享父 scope 中定义的属性,例如在模版中直接使用父 scope 中的对象和属性.通常使用这种直接共享的方式可以实现一些简 ...

  9. UIPickerView的使用(三)

    前两篇文章 UIPickerView的使用(一) . UIPickerView的使用(二),学习了UIPickerView的单列选择器和双列选择器的使用. 现在我们一起学习相互依赖的多列选择器 1.遵 ...

  10. CentOS桌面安装

    1.显示系统已经安装的组件,和可以安装的组件: #yum grouplist 2.如果系统安装之初采用最小化安装,没有安装xwindow,那么先安装: #yum groupinstall " ...