我想問一下,為什么滾動的高度大于等于con1的高度后,滾動的高度又變為0了呢 不是還有con2的內容可以滾動碼
function scrollTop(){
? ? if(area.scrollTop>=con1.offsetHeight){
? ? ? ? area.scrollTop=0;
? ? }
? ? else{
? ? ? ? area.scrollTop++;
? ? }
?}
function scrollTop(){
? ? if(area.scrollTop>=con1.offsetHeight){
? ? ? ? area.scrollTop=0;
? ? }
? ? else{
? ? ? ? area.scrollTop++;
? ? }
?}
2016-10-17
舉報
2016-10-17
他這個con2的內容旨在當你的con1的scrollTop還未到達他的長度時,用來填補con1下面的空白,當con1的scrollTop到達了他的長度,再直接用con1的內容替代con2的內容來繼續顯示。
2016-10-17
為什么不能運行
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>JS動畫案例</title>
<style type="text/css">
? ? *{
? ? ? ? padding:0;
? ? ? ? margin:0;
? ? }
? ? i{list-style: none;filter:alpha(opacity=100);opacity=1;top:20px;}
? ? a{text-decoration: none;display:block;float:left;margin:20px 10px;}
? ? #move{width:300px;height:250px;margin:30px;border:2px solid #ccc;}
</style>
<script type="yundong.js"></script>
<script type="text/javascript">
? ? window.onload=function(){
? ? ? ? var omove=document.getElementById('move');
? ? ? ? var alist=omove.getElementsByTagName('a');
? ? ? ? for(var i = 0;i < alist.length;i++){
? ? ? ? ? ? alist[i].onmouseover=function(){
? ? ? ? ? ? ? var _this=this.getElementsByTagName('i')[0];
? ? ? ? ? ? startmove(_this,{top:-20,opacity:0},function(){
? ? ? ? ? ? ? ? _this.style.top=25+'px';
? ? ? ? ? ? ? ? startmove(_this,{top:20,opacity:100});
? ? ? ? ? ? }); ?
? ? ? ? ? ? }
? ? ? ? ? ??
? ? ? ? }
? ? }
</script>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
</head>
<body>
? ? <div id="move">
? ? ? ?<a href="#" title=""><i><img src="images/jsq1.jpg" alt=""></i><p>計算器1</p></a>
? ? ? ?<a href="#" title=""><i><img src="images/jsq2.jpg" alt=""></i><p>計算器2</p></a>
? ? ? ?<a href="#" title=""><i><img src="images/jsq3.jpg" alt=""></i><p>計算器3</p></a>
? ? ? ?<a href="#" title=""><i><img src="images/jsq1.jpg" alt=""></i><p>計算器4</p></a>
? ? ? ?<a href="#" title=""><i><img src="images/jsq2.jpg" alt=""></i><p>計算器5</p></a>
? ? ? ?<a href="#" title=""><i><img src="images/jsq3.jpg" alt=""></i><p>計算器6</p></a>
? ? </div>
? ??
</body>
</html>