jquery 实现无间图片文字向上滚动效果

以前我们都是用js来实现图片或文字滚动，今天我们来用jquery做一个实现。

/**
 * author junru
 * create time author
 * version 0.1
 * rely on: jquery(/share/js/jquery.js) 1.3.2+
 * description: used this for cache .
 * example :
    if(pathname=="/user/test.html"){
    init.run  = function(){
     alert("test");
    };
    }
 **/
 

function _init(){
 this.start = function(){
  if(this.run instanceof Object){
   this.run();
  }
 } 
}
var init = new _init();

$(document).ready(function(){
  init.start();
});
var pathname = document.location.pathname;
// 首页 js 开始
if(pathname=="/index.net" || pathname=="/" ||pathname == "/index.html"){
 var speed=30;
 var dem;
 var dem1;
 var dem2;
 Marquee =function(){
  if(dem.scrollTop==319){
   dem.scrollTop = 0;
   clearInterval(MyMar1);
   setTimeout(function(){MyMar1=setInterval(Marquee,speed);}, 3000);
  }
  if(dem2.offsetTop-dem.scrollTop<=0){
   dem.scrollTop-=dem1.offsetHeight;
  }else{
   dem.scrollTop++
  }
  if(dem.scrollTop % 80 ==0){
   clearInterval(MyMar1);
   setTimeout(function(){MyMar1=setInterval(Marquee,speed);}, 3000);
  }
 }
 var MyMar1=null;
 var showDiv_1 = function(id){
  var s=id.charAt(1);
  $(".focus_menu").each(function(){
   i = $(this).attr("id");
   $("#c"+i).hide();
   $(this).addClass("normal_menu_d");
   $(this).removeClass("focus_menu");
  });
  $("#"+id).show();
  $("#"+s).addClass("focus_menu");
 }
 jQuery(document).ready(function(){
  jQuery("#menu_head td[sub]").mouseo教程ver(function(){ 
   jQuery("#menu_head td[sub]").removeClass();
   jQuery(".mainbg").hide(); 
   var tmpArr = jQuery(this).attr("sub").split("_");
   jQuery(this).addClass("focus_menu_"+tmpArr[2]); 
   jQuery("#" + jQuery(this).attr("sub")).show();   
  }); 
 });
 var counts = 4; 
 var nnn = 1;
 var customersimages  = new Array();
 var customersimage_alts = new Array();
 customersimages[1]= 'images/friends01.gif';
 customersimages[2]= 'images/friends02.gif';
 customersimages[3]= 'images/friends03.gif';
 customersimages[4]= 'images/friends04.gif';
 customersimage_alts[1] = "中国站长站";
 customersimage_alts[2] = "中顺集团";
 customersimage_alts[3] = "北京师范大学";
 customersimage_alts[4] = "百度";

 changeImg = function() {
  $("#custermerImg").fadeOut("slow",function(){
       document.getElementById("custermerImg").src=customersimages[nnn];  
     document.getElementById("custermerImg").alt=customersimage_alts[nnn];
     $("#custermerImg").fadeIn("slow");
     nnn++;
     if(nnn>counts){
      nnn = 1;
    }
     ttt = setTimeout('changeImg()', 5000); 
   });
 }
 
 changeimg =function(n) {
  nn = n;
  window.clearInterval(ttt);
  changeImg();
 }
 
 moveingimg = function(){
  dem=document.getElementById("certpic");
  dem2=document.getElementById("dem3");
  dem1=document.getElementById("dem2");
  setTimeout(function(){MyMar1=setInterval(Marquee,speed);}, 1500);
  $("#dem").onmouseover=function() {clearInterval(MyMar1)}
  $("#dem").onmouseout=function() {
   clearInterval(MyMar1);
   if(dem.scrollTop % 80 != 0) MyMar1=setInterval(Marquee,speed);
  }
 }

  init.run = function(){
  $(document).ready(function(){$("#query").focus();});
  changeImg();
  moveingimg();
 };
 
 jQuery(document).ready(function(){
  var mainbg = jQuery(".mainbg")
 });
}
//首页JS 结束

//虚拟主机首页 /vhost/index.net
if(pathname=="/vhost/index.net" ||pathname=="vhost/"){

}
//虚拟主机首页 /vhost/index.net 结束

html代码

<div class="customerMain">
    <div class=cert id=certpic style="height:82px; width:218px; margin:0px auto; overflow:hidden;text-align:center">
<div id=dem2>
  <a href=/aboutus/cert.php教程 target=_blank><img src=images/cert0.gif border="0"/></a>
  <a href=/associate/cnnic_cer.net target=_blank><img src=images/cert01.gif height=80 border="0"/></a>
  <a href=/aboutus/cert.php target=_blank><img src=images/cert002.gif border="0"/></a>
  <a href=/associate/credit_king.net target=_blank><img src=images/cert03.gif border="0"/></a>
  <a href=/aboutus/cert.php target=_blank><img src=images/cert0.gif border="0"/></a>
  </div>
              <div id=dem3></div>
            </div>
   </div>
    </div>