Зареждач чрез Javascript

D

Dizasterr

Registered
Здравейте! Искам да си направя зареждач с проценти чрез javascript. Някой има ли идея как ще стане ? Стигнах до тук:
EDIT: Преправих кода, но как да направя да се забавя малко и да се заместват числата ? Пробвах с while.
Код: 
		$p = 0;
		while($p <= 100) {
			document.write($p++);
		}
 
Ето какво написах в този късен час. Ако имаш нужда от обяснения кажи ще едитна поста си с коментари в кода.

Код: 
<html>
<head>
<style type="text/css">
div#mydivi {
height: 20px;
background-color: red;
}
</style>
</head>
<body>
 <div id="mydivi" style="width:0px"></div>
<script language="JavaScript">
var broi = 0;
var t;
function addWidth() {
 var mydiv = document.getElementById("mydivi");
 var curr_width = parseInt(mydiv.style.width);
mydiv.style.width = (curr_width + 10) +"px";
broi = broi + 1;

t=setTimeout("addWidth()", 100);
if (broi == 10) {
clearTimeout(t);
}
 }
addWidth();
 </script>

  </body>
</html>
 
Rushvet каза:
Ето какво написах в този късен час. Ако имаш нужда от обяснения кажи ще едитна поста си с коментари в кода.

Код: 
<html>
<head>
<style type="text/css">
div#mydivi {
height: 20px;
background-color: red;
}
</style>
</head>
<body>
 <div id="mydivi" style="width:0px"></div>
<script language="JavaScript">
var broi = 0;
var t;
function addWidth() {
 var mydiv = document.getElementById("mydivi");
 var curr_width = parseInt(mydiv.style.width);
mydiv.style.width = (curr_width + 10) +"px";
broi = broi + 1;

t=setTimeout("addWidth()", 100);
if (broi == 10) {
clearTimeout(t);
}
 }
addWidth();
 </script>

  </body>
</html>
Увеличете...
Благодаря, но има ли начин с проценти да е ? Изкарван чеслата с while, но незнам как да направя да се сменят през определено време.
 
Написах това, но не се получава:
Код: 
 <html>
<head>
<link type="text/css" href="styles.css" media="screen" rel="stylesheet" />
<link type="text/css" href="css/mint-choc/jquery-ui-1.8rc3.custom.css" media="screen" rel="stylesheet" />
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript" language="JavaScript">	
	$(function() {
	var percent = 0;
	var out;
	
	function load() {
		
		var ob = document.getElementById("load");
		
		for(i = 0; i <= 100; i++) {
		
			var o =	$("#load").value = (percent + 5);
			document.write(o);
	//		document.write(i);
		}
		
		var out = setTimeout( "load()" , 10000);
		
		if(percent == 1000) {
			clearTimeout(out);
		}
		
	}
		load();
	});
</script>
	<div id="load" style="background-color: #FFF; width: 500px; height: 200px; color: #000;" value="0"></div>
	
  </body>
</html>
 
Ако имаш нужда от разяснение пак питай. Предпочитам да едитна моя код вместо да бърникам из твоя.
Код: 
<html>
<head>
<style type="text/css">
div#mydivi {
height: 20px;
background-color: red;
}
</style>
</head>
<body>
 <div id="mydivi" style="width:0px"></div>
<script language="JavaScript">
var broi = 0;
var t;
function addWidth() {
 var mydiv = document.getElementById("mydivi");
 var curr_width = parseInt(mydiv.style.width);
mydiv.style.width = (curr_width + 10) +"px";
mydiv.innerHTML = broi + "%";

broi = broi + 1;

t=setTimeout("addWidth()", 100);
if (broi == 101) {
clearTimeout(t);
}
 }
addWidth();
 </script>

  </body>
</html>
 
Rushvet каза:
Ако имаш нужда от разяснение пак питай. Предпочитам да едитна моя код вместо да бърникам из твоя.
Код: 
<html>
<head>
<style type="text/css">
div#mydivi {
height: 20px;
background-color: red;
}
</style>
</head>
<body>
 <div id="mydivi" style="width:0px"></div>
<script language="JavaScript">
var broi = 0;
var t;
function addWidth() {
 var mydiv = document.getElementById("mydivi");
 var curr_width = parseInt(mydiv.style.width);
mydiv.style.width = (curr_width + 10) +"px";
mydiv.innerHTML = broi + "%";

broi = broi + 1;

t=setTimeout("addWidth()", 100);
if (broi == 101) {
clearTimeout(t);
}
 }
addWidth();
 </script>

  </body>
</html>
Увеличете...
Благодаря! Преправих го малко и стана идеално. Само ще ми обесниш ли за това setTimeout и clearTimeout.
 
setTimeout задава функцията да се изпълнява на 100мс(мисля че е толкова. 1000 е една секунда). И тъй като този код е сложен вътре във функцията той ще се изпълнява постоянно защото веднъж изпълнена функцията стига до края си където и е зададено да се изпълни още веднъж. За да се спре този безкраен цикъл се ползва clearTimeout като при всяко изпълняване на функцията добавям към променливата broi +1 към стойността и. Всеки път в края на функцията правя проверка колко е стойността на broi и ако е достигнала 100 спирам изпълнението на функцията с clearTimeout.
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе