两种文字跑马灯

Html

Css

上课不听讲,一般只有三种情况: 1.手里有个手机. 2.心里有个美女. 3.身边做过逗比.

// // 闪烁 标题信息
  // var mark = true;
  // setInterval(function (){
  //     if (mark == true) { document.title = '【新消息】隔壁老王发来的5条消息.';
  //         mark = false;
  //        
  //     } else{
  //         document.title = '【　　　】隔壁老王发来的5条消息.';
  //         mark = true;
  //     }
  // }, 500);

// 文字的无缝滚动
  setInterval(function() {
      // 获取title中的内容
      var str = document.title;
      // 获取第一个字符
      var fstr = str.charAt(0);
      // 获取剩余的字符
      var estr = str.substr(1);
      // 重写拼接title
      document.title = estr + fstr;
  }, 500);

// 文字滚动
  setInterval(function() {
      var msg1 = document.getElementById('msg1');
      var str1 = msg1.innerHTML;
      msg1.innerHTML = str1.substr(1) + str1[0];

var msg2 = document.getElementById('msg2');
      var str2 = msg2.innerHTML;
      arr = str2.split('');
      arr.push(arr.shift());
      msg2.innerHTML = arr.join('');
      // console.log(arr);
  }, 500);

// 文字paomadenger
  var string = '这个世界需要更多英雄~';
  var string = '上课不听讲,一般只有三种情况: 1.手里有个手机. 2.心里有个美女. 3.身边做过逗比.';
  var i = 0; // 循环初始值

setInterval(function() {
      // 如果下标超过字符长度 就重置为0
      if (i >= string.length) {
          i = 0
      };
      // show(第几个字符串变, 整个字符串)
      document.getElementById('show').innerHTML = show(i, string);
      i++;
  }, 100);

function show(i, str) {
      // 加样式的字串可分为三部分: 变前 + 变大 + 变后
      var tmp = str.substr(0, i);
      tmp += '<font color="#f00" size="7">' + str[i] + '</font>';
      tmp += str.substr(i + 1);
      return tmp;
  }

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

两种文字跑马灯



代码描述：js多种文字跑马灯效果

定时器操作

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

无痕

相关代码

两种文字跑马灯

最新