Animation wrong on mobile safari

[petermikitsh]

I'm having issues with the animation on Mobile Safari. It looks fine in Chrome, so I think my configuration is correct. Left is chrome; right is mobile safari on iPhone 5s simulator.

I'm using React.js and here's my code:

import findDOMNode from 'react-dom/lib/findDOMNode';
import PropTypes from 'prop-types';
import React from 'react';
const Odometer = require('odometer');

export default class ReactOdometer extends React.Component {
  static propTypes = {
    value: PropTypes.number.isRequired
  };

  componentDidMount() {
    const el = findDOMNode(this);
    this.odometer = new Odometer({
      el,
      value: 80,
      duration: 500,
      format: '(,ddd)'
    });
    this.odometer.update(80);

    setTimeout(() => {
      this.odometer.update(91);
    }, 5000);
  }

  componentWillUnmount() {
    this.odometer = null;
  }

  render() {
    return <span />;
  }
}

[petermikitsh]

The hack listed in #134 fixed the problem for me:

.odometer-ribbon-inner { -webkit-backface-visibility: visible !important; }
.odometer-value { -webkit-transform: none !important; }