Button mit ladeanzeige Tutorial - Kostenlose Homepage Tools für deine Homepage auf ntmb.de

Button mit ladeanzeige

Button mit Ladeanzeige

5726 - lucas - 24.01.2010 20:13 Uhr - Version: 4 - - verlinken als BB-Code

HI,

hier zeig ich euch wie Ihr euer Formular mit einer Ladeanzeige (gif-Bild) Pimt ^^

Zu erst braucht ihr ein Formular eurer Wahl, und der Button bekommt onclick="showcssboxwhileuploading()"

`1`	`<input name="nsubmit" value="Hochladen" onclick="showcssboxwhileuploading()" type="submit">`

und im head wird ein js eingebunden

`1`	`<script type="text/javascript" src="lade.js"></script>`

in der js-Datei ( hier "lade.js" ) steht dann

1 2 3 4 5 6 7 8 9 function showcssboxwhileuploading() { var elem = document.getElementById('whileuploading'); if (elem.style.display=="") { elem.style.display="none"; } else { elem.style.display=""; } }

nun müsst ihr nur noch eine div bauen die wen man auf den Button klickt angezeigt wird
z.B.

1 2 3 <div id="whileuploading" style="display:none;"> <img src="http://c-f.lima-city.de/upload/inc/img/loading.gif"> </div>

wichtig ist display:none;

Natürlich könnt ihr die div so gestalten wie ihr wollt, ich hab sie in der Demo 70% transparent gemacht
und über eine andere div gelegt

und fertig ist es

Bei fragen einfach fragen

Mitglieder-Kommentare

#1 von KröteGAMES

Sehr schönes Tut!
Kann man bestimmt mal gebrauchen!

Nur registrierte Mitglieder könnten einen Kommentar schreiben.

Melde dich doch ganz einfach an, es ist kostenlos. :-)