jquery 1行のテキストを上にスクロールする効果の例

2292 ワード

 
<body> 
<div id="title" style="width:100%;height:40px;">        </div> 

<div id="content" class="infocontent"> 
<div id="top" class="infolist"> 
<ul> 
<li>  315  :     “   ”      </li> 
<li>                      </li> 
<li>      “        ”    </li> 
<li>     ：        ：  “  ”</li> 
</ul> 
</div> 
<div id="bottom" class="infolist"></div> 
</div> 
<div id="foot"></div> 
</body>

 
.infolist{width:400px;matgin:0;} 
.infolist ul{margin:0;padding:0;} 
.infolist ul li{list-style:none;height:26px;line-height:26px;} 
.infocontent{width:400px;height:26px;overflow:hidden;border:1px solid #666666;}

 
var interval=1000;//            
var stepsize=26;//       ，        ,             
var objInterval=null; 

$(document).ready( function(){ 
//           
$("#bottom").html($("#top").html()); 

//             
$("#content").bind("mouseover",function(){StopScroll();}); 
$("#content").bind("mouseout",function(){StartScroll();}); 

//      
StartScroll(); 
}); 

//     ，     
function StartScroll(){ 
objInterval=setInterval("verticalloop()",interval); 
} 

//     ，     
function StopScroll(){ 
window.clearInterval(objInterval); 
} 

//     
function verticalloop(){ 
//                 
//   ，    ;  ，       
if($("#content").scrollTop()>=$("#top").outerHeight()){ 
$("#content").scrollTop($("#content").scrollTop()-$("#top").outerHeight()); 
} 
//  jquery           
$("#content").animate( 
{"scrollTop" : $("#content").scrollTop()+stepsize +"px"},600,function(){ 
//           scrollTop，         
// $("#foot").html("scrollTop:"+$("#content").scrollTop()); 
}); 
}

asp.netウェブサイトのトップページはIPによって自ら指定のページの例にジャンプします。

Firefoxでjs selectタグをクリックしても、ポップアップできません。