이것도 이름을 무어라 지어야 할지 모르겠네요.;
정적으로 그래프 수치만 보여주는 것이 아닌 그래프가 그려지는 걸 동적으로 보여주도록 하는 스크립트 입니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
function drawGraph(obj) { this.gages = obj.getElementsByTagName("span"); this.values = obj.getElementsByTagName("em"); for(var i = 0; i < this.gages.length; i ++) { (function(idx) { var current_value = 0; var gage_object = this.gages[idx]; var gage_value = this.values[idx]; var gage_width = parseInt(gage_object.style.width); var timer = null; timer = setInterval(function() { if(current_value < gage_width) { current_value += Math.ceil((gage_width - current_value) / 15); gage_object.style.width = current_value + "%"; gage_value.innerHTML = current_value + "%"; } else { clearInterval(timer); } }, 10); })(i); } } |
http://jsfiddle.net/rootbox/pfpaS/
에서 직접 보고 편집하실 수 있습니다.
오! 전에 보여주셨던 그거군요!!!!
고수님의 기술 잘 보았습니다.
아 나는 언제쯤 이런 스킬을 보유할수 있을까….흑흑
자꾸 이러시면 곤란함;
오호….
자바스크립트로..잘보고 가용
요즘 자스 공부중인지라..ㅎㅎ
도움이 되셨다니 영광입니다. ㅠ..
자..자주 와주세요. 볼건 없..어도;;
천재네
_-…