求高手看看，为什么y轴坐标不增加，而x轴坐标增加！

Question

求高手看看，为什么只有x轴的坐标在增加，而y轴的坐标始终在0 和1之间跳呢
 <script type="text/javascript">
   var directX=1;
   var directY=1;
   var sunX=0;
   var sunY=0;     function move(){
     
 
         sunX+=directX;
 sunY+=directY;
 
 var sunDiv=$("sun");
 sunDiv.style.left=sunX+"px";
 sunDiv.style.top=sunY+"px";
 //判断小球的x坐标
 //offsetWitdth用于获取当前对象的宽度
    if(sunX+sunDiv.offsetWidth>=document.body.clientWidth || sunX<=0){
    directX=-directX;   
 }
 
 if(sunY+sunDiv.offsetHeight>=document.body.clientHeight || sunY<=0){
    directY=-directY;
     
 }
       
   }
   window.setInterval("move()",50);
   
   function $(id){
     return document.getElementById(id);
   }

</script>

Answer 1

if(sunY+sunDiv.offsetHeight>=document.body.clientHeight || sunY<=0){
                directY=-directY;
                 
             }
换成else if(){}试试

Answer 2

else if不是只能判断一个吗，我需要x和y坐标都要判断！