zoukankan      html  css  js  c++  java
  • 觉得猪八戒网左下角的文字滚动,效果不错,自己摸索了一下,以自己的方法实现了!

    觉得猪八戒网左下角的文字滚动,效果不错!

    自己摸索了一下,以自己的方法实现了!

    没有运用jQuery,不过用了自己的编写的Js库!

    有兴趣的可以看看!

    源码:

    css:

     1 *{padding:0;margin:0;font-size:12px;}
     2 .do_ta { border: 1px solid #E4E4E4; margin:10px auto; width:170px; }
     3 .do_ta .ta_ta { background: url("http://s.zbjimg.com/p/zbj/css/../img/tafb.gif") no-repeat; height: 52px; width: 168px; }
     4 .do_ta .ta_tc { height: 61px; line-height: 20px; margin: 10px; overflow: hidden; padding: 0;position:relative; }
     5 .do_ta .ta_tc li { border-bottom: 1px dashed #E4E4E4; color: #666666; height: 60px; margin: 0; overflow: hidden; padding: 0;position:absolute;top:0;left:0;background:#fff;z-index:0;155px; }
     6 .do_ta .ta_tc li .time { color: #999999; }
     7 .do_ta .ta_tc li u { color: #2B9A00; text-decoration:none;}
     8 .do_ta .ta_tc li s { color: #FF3600; text-decoration:none;}
     9 .do_ta .ta_tc li a { color: #1A69DE;text-decoration:none; }
    10 .do_ta .dota_d { padding: 5px 0 15px; text-align: center; }
    11 .do_ta .dota_d a{color:#666;}

     javascript:

     个人js工具库,猛点击!

     1 Meng.extend({
     2     zbjScrollText:function(scrollId){
     3         var li = Meng.getTag('li',Meng.getId(scrollId)),
     4           
     5             curActLi = 0,
     6             getActivity = function(){
     7                 return [li[curActLi],li[10+curActLi],li[20+curActLi],li[30+curActLi]];
     8                 },
     9             sliceDown = function(elem,pos){
    10                 Meng.setStyle(elem,{top:'-60px',zIndex:1});
    11                 Meng.animate(elem,{top:-60},{top:60},800);
    12                 },
    13             play = function(){
    14                 Meng.each(getActivity(),function(i){
    15                     var _this = this;
    16                     setTimeout(function(){
    17                         sliceDown(_this,i);
    18                         },i*900);
    19                     });    
    20                 };
    21                 play();
    22             setInterval(function(){
    23                 if(curActLi == 9){
    24                   curActLi = 0;
    25                   Meng.each(li,function(){Meng.setStyle(this,{zIndex:0})});
    26                 }else curActLi++;
    27                 play();
    28                 },5000);
    29         }
    30         });
    31 Meng.zbjScrollText('dota1');
  • 相关阅读:
    6.3 The Memory Hierarchy
    去掉正在打印对话框
    SQL SERVER格式化字符串位数,不足补零
    WCF学习系列二_使用IIS发布WCF服务
    WCF学习系列一_创建第一个WCF服务
    IrisSkin4控件使用方法
    窗体加载后的设置焦点事件
    SQL 分组后取最小行号记录
    二维数组、齿形数组和游长变元表
    C#数组按值和按引用传递数组区别
  • 原文地址:https://www.cnblogs.com/dreamback/p/2226383.html
Copyright © 2011-2022 走看看