[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Графический прогресс-бар
mshdn
Есть Графический прогресс-бар, т.е. Прогресс-бар построеный на принципе добавления прямоугольников:<div class="one"></div>
.class{background:url(images/one.png)}
с задержкой через settimeout .
Опера отображает правильно, последовательно добавляя по одному прямоуг.
а Firefox накапливает( в Буфере- ?) , а затем выдает 100%.
Как нужно изменить, чтобы правильно работал в Firefox?т.е
отображение происходило сразу, а не накапливалось в буфере?



Спустя 54 минуты, 32 секунды (8.12.2009 - 15:20) waldicom написал(а):
Полный код посмотреть бы

Спустя 9 часов, 16 минут, 52 секунды (9.12.2009 - 00:37) mshdn написал(а):
Посмотрите код:
<script Language="JavaScript"><!--
function fpopup3(n)
{
var x=n; var popup; var i;
popup='';
for(i=1;i<=x;i++)
{
popup+="<div class='one'></div>";
}
return popup;
}
function generate() // эту функцию вызывает форма
{
offerbar=document.getElementById('bar');
offerbar.style.display="block";
var n;
offer=document.getElementById('bar1');
for(n=1;n<=44;n++)
{
p1="<div class='first'></div>";
p1=p1+fpopup3(n);
p1=p1+"<div class='last_load'></div>";
t=n*2;
if(n==44){t=100};
p1=p1+"<span>"+t+"% выполнено</span>";
offer.innerHTML = p1;
k=0;for(j=0;j<400000;j++) k=k+j; // задержка
}
}

//--></script>


 <STYLE type=text/css>  
.shadows {width:100%;height:100%;position:fixed;top:0;left:0;background:#747775;z-
index:10000;opacity:0.6;}
.loader{width:712px;height:44px;background: url(../images/bgr/loader.png) no-
repeat left top;position:fixed;top:50%;margin-
top:-80px;left:50%;margin-left:-356px;z-index:100001}
.loader p{text-align:center;font:bold 20px "arial";text-
align:center;color:#000;margin:-37px 0 0 0;position:relative;z-
index:10;float:left;background:#fff;padding:0 1px;margin-left:110px}
.loader img{position:absolute;left:270px}
.loading{height:25px;width:700px;position:relative;left:5px;top:2px}
.one{background: url(../images/bgr/one.png) no-repeat left
top
;float:left;width:13px;height:38px;margin-right:2px}
.first{background: url(../images/bgr/first.png) no-repeat left
top
;float:left;width:15px;height:38px;margin-right:2px}
.last_load{background: url(../images/bgr/last.png) no-repeat left
top
;float:left;width:15px;height:38px}
</style>
<!--
здесь - shadows - затетение
loader.png - полоса для бара
first_load.png - начальный прямоуг.
last_load.png - конечный
one.png - средний
-->


<div id="bar" style="display:none">
<div
class="shadows"></div>
<div
class="loader">
<p>
Генерация идей подарков! пожалуйста подождите</p>
<div
class="loading" id ="bar1">
<div
class="first"></div>
<span>
00% выполнено</span>
</div>
</div>
</div>
<!-- bar -->
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.