javascript - Converting jQuery's CSS timing to ms - Stack Overflow

admin管理员组

文章数量:1335138

When asking jQuery for a duration in CSS, it returns this value in seconds, e.g. 1.2s. Example here.

var d = $("div"),
    propDur = d.css("animation-duration"),
    propDurArr = propDur.replace(" ","").split(","),
    propDel = d.css("animation-delay"),
    propDelArr = propDel.replace(" ","").split(",");

console.log(propDurArr[propDurArr.length - 1]);
console.log(propDelArr[propDelArr.length - 1]);

Two questions for this:

1. Is this cross-browser? Does jQuery (or better: the browser) always return the value in seconds, or do some browsers prefer a ms representation?
2. How do I convert this value in jQuery/JS to ms (without ms)? For example: 1.2s -> 1200.

For 2. you can easily remove the dot, like so:

propDel.replace(/(\s|.)/g,"").split(",")

But how do I make a condition like this:

if  string contains dot
     ADD 00
if  string does NOT contain dot
     ADD 000

Please reply to 1 and 2.

When asking jQuery for a duration in CSS, it returns this value in seconds, e.g. 1.2s. Example here.

var d = $("div"),
    propDur = d.css("animation-duration"),
    propDurArr = propDur.replace(" ","").split(","),
    propDel = d.css("animation-delay"),
    propDelArr = propDel.replace(" ","").split(",");

console.log(propDurArr[propDurArr.length - 1]);
console.log(propDelArr[propDelArr.length - 1]);

Two questions for this:

1. Is this cross-browser? Does jQuery (or better: the browser) always return the value in seconds, or do some browsers prefer a ms representation?
2. How do I convert this value in jQuery/JS to ms (without ms)? For example: 1.2s -> 1200.

For 2. you can easily remove the dot, like so:

propDel.replace(/(\s|.)/g,"").split(",")

But how do I make a condition like this:

if  string contains dot
     ADD 00
if  string does NOT contain dot
     ADD 000

Please reply to 1 and 2.

• javascript
• css
• regex

Share Improve this question Follow edited May 25, 2015 at 15:30 Bram Vanroy asked May 25, 2015 at 13:36 Bram VanroyBram Vanroy 28.6k2727 gold badges147147 silver badges265265 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 7

I decided to go with @RobG's ment that he hasn't posted as answer yet, so here goes. Quite simple and effective:

function toMS(s) {
    return parseFloat(s) * (/\ds$/.test(s) ? 1000 : 1);
}

This is only an answer to question #2. You can use parseFloat() to get the numerical representation, up to the first non-number (or dot) character. So, parseFloat("1.2s")*1000 returns 1200, while parseFloat("1s")*1000 returns 1000.

Check this solution to convert css time to millisecond:

function css_time_to_milliseconds(time_string) {
   var num = parseFloat(time_string, 10),
       unit = time_string.match(/m?s/),
       milliseconds;

   if (unit) {
       unit = unit[0];
   }

   switch (unit) {
       case "s": // seconds
           milliseconds = num * 1000;
           break;
       case "ms": // milliseconds
           milliseconds = num;
           break;
       default:
           milliseconds = 0;
           break;
   }

   return milliseconds;
}

1) The animation can either be in seconds or milliseconds - do not expect it to always be one or the other. The suffix will either be s or ms.

2) As for converting:

// provided `value` contains what you got from jQuery
var multiply = value.indexOf('ms') !== -1 ? 1 : 1000;
var converted = parseInt(parseFloat(value) * multiply, 10);
// converted now contains the value in millseconds

本文标签： javascriptConverting jQuery39s CSS timing to msStack Overflow