2016-03-21 11 views
0

ich einen Code haben, wo dies funktioniert:Variable nicht überprüft in if-Bedingung

forward = 1; 
rate = forward - remaining/duration; 

aber das funktioniert nicht:

forward = 1; 
if (forward == 1) { 
    rate = forward - remaining/duration 
} 

Warum wäre es nicht?


Da SE will mich halten von den vollständigen Code zu veröffentlichen, weil dann meine „post meist Code ist“, na ja, ich glaube, ich brauche etwas bla bla hinzuzufügen -, die nur verwirren und ablenken Sie, aber Das wird mir hoffentlich erlauben, den kompletten Code hier unten zu posten.

Komplette Arbeitscode:

<!DOCTYPE html> 
 
    <html lang="de-DE"> 
 
    <head> 
 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
 
     <meta charset="UTF-8"> 
 

 
     <title>1 Minute</title> 
 

 
     <style type="text/css"> 
 
      svg { 
 
       display: block; 
 
       width: 250px; 
 
       height: 250px; 
 
       position: absolute; 
 
       top: 20px; 
 
       right: 20px; 
 
       } 
 
      #timer { 
 
       fill: #bd4; 
 
       } 
 
     </style> 
 

 
    </head> 
 
    <body> 
 
     <svg viewbox="0 0 250 250"> 
 
      <path id="timer" transform="translate(125,125)"/> 
 
     </svg> 
 
     <script> 
 
      "use strict"; 
 
      var cancel = false; 
 
      /* http://cdn.rawgit.com/darius/requestAnimationFrame/master/requestAnimationFrame.min.js */ 
 
      /* https://github.com/darius/requestAnimationFrame */ 
 
      if(!Date.now)Date.now=function(){return(new Date).getTime()};(function(){var n=["webkit","moz"];for(var e=0;e<n.length&&!window.requestAnimationFrame;++e){var i=n[e];window.requestAnimationFrame=window[i+"RequestAnimationFrame"];window.cancelAnimationFrame=window[i+"CancelAnimationFrame"]||window[i+"CancelRequestAnimationFrame"]}})(); 
 

 
      /*! SVG Pie Timer 0.9.1 | Anders Grimsrud, grint.no | MIT License */ 
 
      /* https://github.com/agrimsrud/svgPieTimer.js */ 
 
      ;(function(w) { 
 

 
       'use strict'; 
 

 
       // Date.now fix by Ari Fuchs, afuchs.tumblr.com/post/23550124774/date-now-in-ie8 
 

 
       Date.now = Date.now || function() { return +new Date }; 
 

 
       // Draw SVG path 
 

 
       function draw(element, rate) { 
 
        var count = element.length, 
 
         angle = 360 * rate; 
 

 
        angle %= 360; 
 

 
        var rad = (angle * Math.PI/180), 
 
         x = Math.sin(rad) * 125, 
 
         y = Math.cos(rad) * - 125, 
 
         mid = (angle > 180) ? 1 : 0, 
 
         shape = 'M 0 0 v -125 A 125 125 1 ' 
 
           + mid + ' 1 ' 
 
           + x + ' ' 
 
           + y + ' z'; 
 

 
        // If array of elements, draw each one 
 

 
        if(element instanceof Array) 
 
         while(count--) 
 
          element[count].setAttribute('d', shape) 
 
        else 
 
         element.setAttribute('d', shape) 
 
       } 
 

 
       // Prepare timer 
 
       // Define in global scope 
 

 
       w.svgPieTimer = function(props) { 
 

 
        var element = props.element, 
 
         duration = props.duration || 1000, 
 
         forward = props.forward; 
 

 
        // Optional warning 
 

 
        if(!element) throw "SVG Pie Timer: Error - element required" 
 

 
        // This part might be confusing: 
 
        // If n==0, do infinite loops 
 
        // In other cases where n is set, do n loops 
 
        // If n is not set, do 1 loop 
 
        // Do it this way to prevent mixing n==0 and !n 
 

 
        var end = Date.now() + duration; 
 

 
        // Animate frame by frame 
 

 
        (function frame() { 
 
         var current = Date.now(), 
 
          remaining = end - current, 
 

 
          // Now set rotation rate 
 
          // E.g. 50% of first loop returns 1.5 
 
          // E.g. 75% of sixth loop returns 6.75 
 
          // Has to return >0 for SVG to be drawn correctly 
 
          // If you need the current loop, use Math.floor(rate) 
 

 
          rate = forward - remaining/duration 
 

 
         // As requestAnimationFrame will draw whenever capable, 
 
         // the animation might end before it reaches 100%. 
 
         // Let's simulate completeness on the last visual 
 
         // frame of the loop, regardless of actual progress 
 

 
         if(remaining < 60) { 
 

 
          // 1.0 might break, set to slightly lower than 1 
 

 
          draw(element, 1 - 0.0001); 
 

 
          // Stop animating when the circle is full 
 

 
          if(remaining < duration) { 
 
           return 
 
          } 
 
         } 
 

 
         // Draw 
 

 
         draw(element, rate); 
 

 
         // Request next frame 
 
         if (cancel === false) { 
 
          requestAnimationFrame(frame); } 
 
         }()); 
 
       } 
 

 
      })(window, undefined); 
 

 
      svgPieTimer({ 
 
       // Element (Required) SVG sub element to animate. Accepts array. 
 
       element: [timer], 
 

 
       // Duration (Optional) In milliseconds. Defaults to 1000. 
 
       duration: 3000, 
 
       
 
       // 1 = clockwise ("growing"), 0 = counter-clockwise ("decreasing") 
 
       forward: 1 
 
      }); 
 
     </script> 
 
    </body> 
 
    </html>

+0

Funktioniert nicht? Was heißt das? Irgendein Fehler? Was ist der Fehler? –

+0

Es ist wahrscheinlich, weil Sie die Forward Variable außerhalb der Schließung deklarieren? Und ersetzen Sie auch == mit === für mehr Strenge – KyleK

+0

Was sehen Sie in der Konsole, wenn Sie 'console.log (" vorwärts: "+ vorwärts)' –

Antwort

0

Ich glaube, Sie einige Syntaxfehler hatte:

var current = Date.now(), 
         remaining = end - current, 
         rate; 

statt

var current = Date.now(), 
         remaining = end - current, 

Siehe diese Geige: http://jsfiddle.net/pmxffvp8

+1

@was Funktioniert das für Sie? Sollte es aufhören oder umgekehrt? Tellme, wenn ich es besser beheben kann ... – malix

Verwandte Themen