За последние 24 часа нас посетили 20117 программистов и 1711 роботов. Сейчас ищут 1408 программистов ...

Динамическое изменение параметра width

Тема в разделе "JavaScript и AJAX", создана пользователем kzpromo, 12 мар 2011.

  1. kzpromo

    kzpromo Активный пользователь

    С нами с:
    26 июн 2010
    Сообщения:
    12
    Симпатии:
    0
    Здраствуйте! Прошу вашей помощи
    Пытаюсь сделать динамическое изменение параметра width
    ic = '<span style="width: '+i.toFixed(2)+'%; background: #'+color+'; color:#f3ecec; text-shadow: 1px 1px 1px #6e6e6e;">'+percent+'%</span>';
    HTML:
    1. .polled { height: 22px; }
    2. .voted { height: 11px; }
    3. .progress { border: 1px solid #ccc; position: relative; display: block; padding: 0; margin:4px 0; background: #DEDEDE; background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#e9e9e9)); background: -moz-linear-gradient(top, #ccc, #e9e9e9);
    4.     filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#e9e9e9');
    5.  
    6.     -moz-box-shadow:0 1px 0 #fff;
    7.     -webkit-box-shadow:0 1px 0 #fff;
    8.     box-shadow:0 1px 0 #fff;
    9.  
    10.     -moz-border-radius: 4px;
    11.     -webkit-border-radius: 4px;
    12.     border-radius: 4px;
    13. }
    14. .polled span { height:20px; }
    15. .voted span { height: 9px; }
    16. .progress span { display: block; margin: 0; padding: 0; text-align:center; width:0;
    17.    
    18.     -moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    19.     -webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    20.     box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    21.  
    22.     -moz-border-radius: 3px;
    23.     -webkit-border-radius: 3px;
    24.     border-radius: 3px;
    25. }
    26. .progress span b { color:#fff; line-height:20px; padding-left:2px; text-shadow:0 1px 1px rgba(0, 0, 0, 0.5); }
    27.  
    28. .progress_1 span {
    29.     border: 1px solid #f47a20; background-color: #faa51a;
    30.     background: -moz-linear-gradient(top, #faa51a 10%, #f47a20 90%);
    31.     background: -webkit-gradient(linear, left top, left bottom, color-stop(0.1, #faa51a), color-stop(0.9, #f47a20));
    32.     filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
    33. }
    34. <script type="text/javascript">
    35. function pause(n){
    36.  today=new Date()
    37.   today2=today
    38.   while((today2-today)<=n){
    39.  today2=new Date()
    40.  }
    41. }
    42.  
    43. var color = 'b4ff00';
    44. var percent = '100';
    45. var i=0;
    46. var ic = '';
    47. while (i<=100)
    48.  {
    49.  ic = '<span style="width: '+i.toFixed(2)+'%; background: #'+color+'; color:#f3ecec; text-shadow: 1px 1px 1px #6e6e6e;">'+percent+'%</span>';
    50.   document.getElementById('ooo').innerHTML = ic;
    51.   i = i + 0.01;
    52.   pause(0.5);
    53.   }
    54. <div id="ooo" class="progress voted progress-1"></div>
    Не знаю в чем причина того, что число не изменяется :(