如果條件在jquery中不工作

-1

<html> 

<head> 
    <title>Jquery-Assignment</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
    <style> 
     * { 
      margin: 0; 
      padding: 0; 
     } 
     .container, 
     .container2 { 
      width: 49%; 
      border-right: 5px solid #000; 
      float: left; 
      box-sizing: border-box 
     } 
     .container2 { 
      border: none; 
     } 
     .controls { 
      padding-bottom: 50px; 
      margin: 10px; 
     } 
     .ball, 
     .ball2 { 
      border-radius: 50%; 
      background-color: #000; 
      width: 100px; 
      height: 100px; 
      position: relative; 
      left: 0; 
     } 
    </style> 
</head> 

<body> 
    <div class="main"> 
     <div class="container"> 
      <div class="controls"> <span><a href="#" id="prev"><img src="arrow-prev.png"/></a></span> <span><a href="#" id="next"><img src="arrow-next.png"/></a></span> </div> 
      <div class="ball-path"> 
       <div class="ball" id="ball"></div> 
      </div> 
     </div> 
     <div class="container2"> 
      <div class="controls"> <span><a href="#" id="prev"><img src="arrow-prev.png"/></a></span> <span><a href="#" id="next"><img src="arrow-next.png"/></a></span> </div> 
      <div class="ball-path"> 
       <div class="ball" id="ball"></div> 
      </div> 
     </div> 
    </div> 
    <script> 
     var n; 
     var w = $(".container").width(); 
     var b = $("#ball").width(); 
     var pos = (w - b + 'px'); 
     $('#next').on('click', function() { 
      n = $("#ball").css("left") debugger; 
      if (n <= pos) { 
       $("#ball").animate({ 
        left: '+=20' 
       }, 1); 
      } else { 
       $("#ball").animate({ 
        left: '+=0' 
       }, 1); 
      } 
     }); 
     $('#prev').on('click', function() { 
      n = $("#ball").css("left") if (n == '0px') { 
       $("#ball").animate({ 
        left: '-=0' 
       }, 1); 
      } else { 
       $("#ball").animate({ 
        left: '-=20' 
       }, 1); 
      } 
     }); 
    </script> 
</body> 

</html>

注意：左邊的位置增加了20px;所以如果容器的寬度是600或620或640，那麼它正在工作，但是當我使用盒子尺寸屬性，然後變成615像素，因爲邊框是5像素。那麼較小的條件不起作用。請爲此提出任何答案。如果條件在jquery中不工作

如果任何機構無法承受上面的話，請添加和刪除箱子尺寸屬性。

來源

2015-02-06 Pushpendra Singh

在'n = $（「＃ball」）.css（「left」）後面放一個';'' – Satpal 2015-02-06 07:53:21

我已糾正，但沒有影響 – 2015-02-09 05:11:45

我不確定如果我明白你的理解。但事情是如果你使用邊框，它使得/強制寬度包括邊框&填充

來源

2015-02-06 08:08:29 Hilmanrdn

是寬度添加填充，但然後jQuery條件不起作用。你有什麼答案嗎？ – 2015-02-09 05:09:13

如果條件在jquery中不工作

回答

相關問題