zoukankan      html  css  js  c++  java
  • Jquery消息滚动

    又是一次作业练习,jquery消息滚动,效果图如下:

    源码下载及效果预览:https://www.jq22.com/jquery-info22971

    代码实现起来很简单,所以看起来效果也是很不如人意,就当记录一下子趴

    推荐链接 

           无缝滚动:http://www.jq22.com/jquery-info22981

           推送滚动:http://www.jq22.com/jquery-info22468

    现在来简单写一下自己的这个代码实现

    js代码:

      $(function(){
                         //滚动事件,每两秒滚动一次
                           var mun =setInterval(function(){
                              $("li:last").hide("slow").prependTo($("#file0")).slideDown();
                              },2000);
                         //鼠标悬停事件,悬停停止滚动,鼠标移出开始滚动
                         $("li").hover(function(){
                              clearInterval(mun);
                          },function(){
                             mun = setInterval(function(){
                                   $("li:last").hide("slow").prependTo($("#file0")).slideDown();
                                 },2000);
                          }
                         );

    过一遍jq的方法和事件

    定时器:

     setInterval() :按照指定的周期(以毫秒计)来调用函数或计算表达式。方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。

     setTimeout() :在指定的毫秒数后调用函数或计算表达式。

    定时器是使用js的内容。详情参考 https://www.runoob.com/w3cnote/js-timer.html

    hide属性:隐藏显示的元素和它对应的是show属性代码中的slideDown可以替换成show(),都是动画效果而已

    prependTo属性:把所有匹配的元素前置到另一个、指定的元素元素集合中。案例中是每隔一秒把最后一个li添加到ul中,

    代码太简洁了不知道写啥了QAQ

         

  • 相关阅读:
    vue slot
    展开合并全都是数组元素的数组
    vue中.sync 修饰符
    数组内元素全都是数组,展开并合并
    关于elment-ui树形控件Tree的使用
    vuejs实现瀑布流布局(三)
    Date对象设置一天的0点
    汇报一下这段时间的消失
    使用bootstrap3.0搭建一个具有自定义风格的侧边导航栏
    优秀HTML5活动页面
  • 原文地址:https://www.cnblogs.com/2979100039-qq-con/p/12715306.html
Copyright © 2011-2022 走看看