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

Du bist hier: Startseite » Tutorials » Button mit ladeanzeige Tutorial

Button mit ladeanzeigeButton mit Ladeanzeige

206 Zugriffe -

- 24.01.2010 20:13 Uhr - Tutorial-Version: 4 -

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()"

CODE:


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

und im head wird ein js eingebunden

CODE:


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

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

CODE:


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.

CODE:


<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

Zurück

Mitglieder-Kommentare

#1 von

KröteGAMES

am 30.01.2010 um 12:17 Uhr

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

Nur regestrierte Mitglieder könnten ein Kommentar schreiben.

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