Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.01.2018, 21:24
Новичок на форуме
Отправить личное сообщение для jenkasia Посмотреть профиль Найти все сообщения от jenkasia
 
Регистрация: 09.01.2018
Сообщений: 1

Помогите разелить число
Вобщем есть такое задание: нужно разделить то что передается в m1 раздерить наа 6 цифр и чтобы каждая передавалась в m1 m2 m3 m4 m5 m6 соответственно
<!doctype html>
<html>

<head>
    <title>untitled</title>
    <meta charset="utf-8">
    <script src="https://code.jquery.com/jquery-1.9.1.js"></script>
    <style>
        @font-face {
            font-family: 'Intro';
            src: url('http://s.platformalp.ru/fonts/intro/400.woff2') format('woff2')
        }

        #n1 {
            font-size: 104px;
            font-weight: 600;
            font-family: 'Intro';
            color: #999999;
        }
    </style>
    <script>
        $(function() {
            $({
                n: 100000
            }).animate({
                n: 101000
            }, {
                duration: 20000e1,
                step: function(a) {

                    $("#m1").html(a | 0)
                }
            })
        });
    </script>
</head>

<body>
    <div id="n1">
        <span id="m1"></span>
        <span id="m2"></span>
        <span id="m3"></span>
        <span id="m4"></span>
        <span id="m5"></span>
        <span id="m6"></span>
    </div>
    <div id="n2"></div>
    <div id="n3"></div>
    <div id="n4"></div>
</body>

</html>

Последний раз редактировалось jenkasia, 09.01.2018 в 21:28.
Ответить с цитированием
  #2 (permalink)  
Старый 09.01.2018, 23:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

анимация чисел на jquery
jenkasia,
<!doctype html>
<html>

<head>
    <title>untitled</title>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <style>
    @font-face{
      font-family:'Intro';
      src:url('http://s.platformalp.ru/fonts/intro/400.woff2') format('woff2');
    }

    .num{
      font-size:104px;
      font-weight:600;
      font-family:'Intro';
      color:#999999;
    }

    .num .m{
      color:#FF1493;
    }

    .num .m:nth-last-child(n +4){
      color:#006400;
    }
    </style>
    <script>
$(function() {
  $(".num").each(function(c, b) {
    b = $(b);
    var a = b.data();
    $({n:a.num}).animate({n:a.end}, {duration:a.duration, step:function(a) {
      a = ("" + (a | 0)).split("").reduce(function(a, b) {
        return a + "<span class='m'>" + b + "</span>";
      }, "");
      b.html(a);
    }});
  });
});
    </script>
</head>

<body>
    <div class="num" data-num="100000"  data-end="101000"  data-duration="200000"></div>
    <div class="num" data-num="15000"  data-end="0"  data-duration="20000"></div>
</body>

</html>
Ответить с цитированием
  #3 (permalink)  
Старый 09.01.2018, 23:21
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

$("#m1").html(+(a+'')[0])
$("#m2").html(+(a+'')[1])
$("#m3").html(+(a+'')[2])
$("#m4").html(+(a+'')[3])
$("#m5").html(+(a+'')[4])
$("#m6").html(+(a+'')[5])
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите округлить число sgroup Элементы интерфейса 1 05.05.2017 20:20
Помогите, пожалуйста eljakovarkadiy Events/DOM/Window 9 19.10.2016 13:45
Помогите вытащить скрипт с лендинга gladich93 Общие вопросы Javascript 4 18.12.2015 19:28
Помогите новичку! Рандомное число dievall Ваши сайты и скрипты 1 01.12.2014 08:24
Как найти наибольшее число и ввести его на экран? Ivan152 Оффтопик 2 20.05.2012 20:13