티스토리 뷰
Ajax.request
Ajax.update
작동시마다 자동으로 '기다려주세요' 와 같은 표시를 하고싶을때
표시를 1개로 통일하여 사용하는것이다.
<style type="text/css">
<!--
div.indicator {
position: fixed;
bottom: 0;
padding: 0;
height: 20px;
margin: 0;
padding: 5px;
width: 100%;
background-color: #FFFF99;
display: block;
text-align: center;
font: bold 1.3em 'Verdana, Arial, Helvetica, sans-serif';
}
-->
</style>
<script type="text/javascript">
//<![CDATA
// Global Ajax Indicator
var Indicator = Class.create({
initialize: function() {
this.element = document.createElement('div');
this.element.setStyle({ display:'none' });
this.element.addClassName('indicator');
this.element.update('<img src="/images/protoload/waiting.gif" width="16" height="16" align="absmiddle"> Working...');
document.body.insert(this.element, { position:'bottom' });
},
show: function() {
//this.element.show();
Effect.Appear(this.element, {duration: 0.25, queue: 'end'} );
},
hide: function() {
//this.element.hide();
Effect.Fade(this.element, {duration: 0.25, queue: 'end'} );
}
});
document.observe('dom:loaded', function(e) {
// Indicator
Indicator = new Indicator();
// Indicator 이용 Ajax 작동상태 표시기 셋팅
Ajax.Responders.register({
onCreate: function() {
Indicator.show();
Ajax.activeRequestCount++;
},
onComplete: function() {
Indicator.hide();
Ajax.activeRequestCount--;
}
});
});
//]]>
</script>
'웹프로그래밍 > js' 카테고리의 다른 글
| PrototypeXtensions (0) | 2009.04.23 |
|---|---|
| JS Tree 링크들 (0) | 2009.04.08 |
| scriptaculous 웹문서 (0) | 2009.03.25 |
| Prototype.js 확장 컨트롤 LivePipe UI (0) | 2009.03.25 |
| [Prototype] Class, invoke 사용예제 (0) | 2009.03.24 |
댓글
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
TAG
- JQuery
- CSS
- IOS
- iis
- nodejs
- Mac
- Prototype
- IE
- sencha touch
- laravel
- PHP
- Wordpress
- API
- nginx
- javascript
- classic asp
- mssql
- Android
- Debug
- iphone
- Docker
- JSON
- macos
- 워드프레스
- Linux
- git
- ASP
- 한글
- 안드로이드
- centos
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 |
글 보관함