zoukankan      html  css  js  c++  java
  • 公告信息滚动功能

    直接怼功能代码:

    这是第一种从下出现的方法:

    var time;//声明定时器变量
    clearInterval(time);//初始清除定时器
    time = setInterval(function() {//创建定时器
    var $ul = $("#gg");//利用jquery获取公告的ul
    $ul.animate(3000,function(){//给ul动画,3s
    $ul.append($ul.find("li:first"));//将获取到的第一个li添加到ul的最后
    $ul.find("li:nth-child(3)").hide();//因为我定义公告为3行,第三行出现要有个隐藏显示的动画,所以先隐藏第3行的li
    $ul.find("li:nth-child(3)").fadeIn(1000);//1s内显示第三行的li
    });
    },3000);//没3s执行一次定时器

    这是第二种从上出现的方法:

    $(function(){
    var scrtime;
    $("#quotation").hover(function(){//鼠标放到公告的区域不再滚动
    clearInterval(scrtime);//清除定时器

    },function(){
    scrtime = setInterval(function(){//创建定时器
    var $ul = $("#quotation ul");
    /*获取到ul下的最后一个li*/
    var liHeight = $ul.find("li:last").height();
    $ul.animate({marginTop : liHeight + 35 + "px"},1000,function(){
    $ul.find("li:last").prependTo($ul)//把获取到的li添加到ul的最前面
    $ul.find("li:first").hide();//最后一个li隐藏
    $ul.css({marginTop:0});//ul位置不变
    $ul.find("li:first").fadeIn(1000);//在1s内把添加到第一个位置的li渐渐显示出来
    });
    },4000);//每4s执行一次

    }).trigger("mouseleave");//触发元素quotation的mouseleave事件
    });
     
  • 相关阅读:
    行测-民法典
    行测-中心理解
    行测-资料分析
    行测-数量关系
    行测-三视图、截面图、立体拼合
    行测-加强题型
    C# Unity游戏开发——Excel中的数据是如何到游戏中的 (四)2018.4.3更新
    UGUI batch 规则和性能优化
    Unity 绘图性能优化
    Unity UGUI —— 鼠标穿透UI问题(Unity官方的解决方法)
  • 原文地址:https://www.cnblogs.com/thongyan/p/7026392.html
Copyright © 2011-2022 走看看