Ladebalken
Beitrag von puentas am: 27.08.2008 22:52:16

Hallo,
beim klicken auf einen link möchte ich das ein DIV sich öffnet mit einem Ladebalken. Sind die Daten geladen soll der Inhalt angezeigt werden...

Ist sowas möglich, wenn ja wie?

AW: Ladebalken
Beitrag von PAS am: 28.08.2008 12:37:47

Hi,
hier eine kleine Auswahl von solchen Scripten:
http://www.drweb.de/trickkiste/tricks130.shtml
http://www.web-toolbox.net/webtoolbox/diverses/preloader-info.htm
http://www.jstruebig.de/web/javascript/source/preloader.html

Ansonsten das ganze ohne Ladebalken einfach mit den bekannten AJAX-Framwork:
http://jquery.com/
http://mootools.net/

Gruss Patrick

AW: Ladebalken
Beitrag von puentas am: 28.08.2008 14:53:16

hallo,
das hast du mich muissverstanden..

Ich habe folgendes:


Jetzt soll per Ajax die Variable $userinfo geladen werden (dynamisch aus DB) und ein ladebalken in dem div sein

AW: Ladebalken
Beitrag von PAS am: 29.08.2008 10:19:51

HI,
dann muss du via Ajax die Daten via get oder post laden.
Schau dir dazu mal das an:
http://demos.mootools.net/Request.HTML
Dokumentation: http://docs.mootools.net/Request/Request

Code vom Mootools-Beispiel:

PHP-Code:
window.addEvent('domready', function() {
	// You can skip the following two lines of code. We need them to make sure demos
	// are runnable on MooTools demos web page.
	if (!window.demo_path) window.demo_path = '';
	var demo_path = window.demo_path;
	// --
 
	//We can use one Request object many times.
	var req = new Request.HTML({url:demo_path+'data.html', 
		onSuccess: function(html) {
			//Clear the text currently inside the results div.
			$('result').set('text', '');
			//Inject the new DOM elements into the results div.
			$('result').adopt(html);
		},
		//Our request will most likely succeed, but just in case, we'll add an
		//onFailure method which will let the user know what happened.
		onFailure: function() {
			$('result').set('text', 'The request failed.');
		}
	});
 
	$('makeRequest').addEvent('click', function() {
		req.send();
	});
 
});

Du musst eben noch vor "onSuccess" die Ladegrafik einbinden:


Gruss Patrick