Интервал между числами в анимации плагина flipcounter - jquery

0

Мы хотим реализовать перелистывание цифр. Я использую плагин Flipcount, в котором мы должны предоставить полный номер изображения в формате .png. Но моя проблема заключается в том, что нам нужен разрыв между числами, как показано на рис. ниже:

Изображение 174551

Я использую плагин FlipCounter 1.2. Мой код и конфиг:

$(".total_box").flipCounter({
        number:10032463, // the initial number the counter should display, overrides the hidden field
        numIntegralDigits:1, // number of places left of the decimal point to maintain
        numFractionalDigits:0, // number of places right of the decimal point to maintain
        digitClass:"counter-digit", // class of the counter digits
        counterFieldName:"counter-value", // name of the hidden field
        digitHeight:40, // the height of each digit in the flipCounter-medium.png sprite image
        digitWidth:30, // the width of each digit in the flipCounter-medium.png sprite image
        imagePath:"../layout/images/flipCounter-medium.png", // the path to the sprite image relative to your html document
        easing: true, // the easing function to apply to animations, you can override this with a jQuery.easing method
        duration:10, // duration of animations
        onAnimationStarted:false, // call back for animation upon starting
        onAnimationStopped:false, // call back for animation upon stopping
        onAnimationPaused:false, // call back for animation upon pausing
        onAnimationResumed:false // call back for animation upon resuming from pause
});

В настоящее время я получаю:

Изображение 174551

Как добавить пробелы между цифрами?

  • 0
    Как выглядит сгенерированный HTML?
  • 0
    просто проверьте и найдите нужный элемент и переопределите его, добавив padding
Теги:

1 ответ

1
Лучший ответ

Добавьте это в свой CSS

.counter-digit {margin: 0px 10px;}

или добавление margin: 0px 10px; к любому текущему стилю .counter-digit если он уже присутствует.

  • 0
    Спасибо. Сейчас работает. Я пытался дать padding, который не работал :)
  • 0
    Большой! Пожалуйста, примите ответ, если это помогло :)

Ещё вопросы

Сообщество Overcoder
Наверх
Меню