kostenloser Webspace werbefrei: lima-city


Ladeanimation auf Webseite einbinden

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    php-test1

    Kostenloser Webspace von php-test1

    php-test1 hat kostenlosen Webspace.

    Hallo,

    Ich möchte auf meiner Webseite eine Ladeanimation einbinden, ich weis aber leider nicht wie das geht.
    Also weis vielleicht jemand von euch den Quellcode wie ich die animation in die Webseite einbinden kann.

    Würd mich sehr für Antworten freuen
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. hackyourlife

    Moderator Kostenloser Webspace von hackyourlife

    hackyourlife hat kostenlosen Webspace.

    Eine Ladeanimation wofür?

    Die Grafik ist normalerweise ein animiertes GIF das zur entsprechenden Zeit angezeigt wird und wenn das bestimmte Etwas fertig geladen worden ist wird sie wieder versteckt...

    // EDITː
    Fall du mit Ladeanimation meinst "Animation bis die Seite komplett geladen wurde":
    Erster Treffer bei Google: http://tecpath.com/loading-screen-mit-javascript/

    Beitrag zuletzt geändert: 15.9.2012 11:28:30 von hackyourlife
  4. Was heißt Ladeanimation? Falls du die komplette Seite erst anzeigen willst wenn sie geladen ist so kannst du dafür auf Ajax zurückgreifen..ich empfehle dir mit Jquery zu arbeiten das ist gut zu verstehen
  5. Autor dieses Themas

    php-test1

    Kostenloser Webspace von php-test1

    php-test1 hat kostenlosen Webspace.

    imho schrieb:
    Was heißt Ladeanimation? Falls du die komplette Seite erst anzeigen willst wenn sie geladen ist so kannst du dafür auf Ajax zurückgreifen..ich empfehle dir mit Jquery zu arbeiten das ist gut zu verstehen


    Die .gif Animation habe ich schon, aber ich wollte jetzt den Quelltext wissen, womit ich die Animation einbinden kann.
    Und ja, die Seite soll dann erst angezeigt werden wenn sie vollständig geladen ist.
  6. Ein bisschen Eigeninitiative wäre angebracht....hier ein nettes Tutorial http://net.tutsplus.com/tutorials/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/


    EDIT: Wenn man aber überlegt, ist es schwachsinnig eine ganze Seite mit Ajax zu laden, weil Ajax nur sinnvoll ist wenn man weniger als 50% 60% der Seite laden will, weil nur dann Bandbreite eingespart wird....eine ganze Seite zu verzögern kann und ist nur sinnvoll wenn große Datenmengen geladen werden

    Beitrag zuletzt geändert: 15.9.2012 12:00:47 von imho
  7. g****e

    <html>
    <head>
    <script>
    window.onload = function()
    {
        //kram mit Ajaxladen, parsen, und wenn alles fertig ist mittels document.body.innerHTML = parsedContent; den HTML content zuweisen
    }
    </script>
    </head>
    <body>
    <img src="loading.gif" />
    </body>
    </html>


    Einfacher gehts nu wirklich nicht, wie ich finde... Hat aber vllt kleine Probleme... Ist außerdem nur dann Sinnvoll, wenn du wirklich viele und große Daten zu laden hast, und so demonstrieren willst, dass was getan wird. Bei 1Mb oder so ist das total unnötig, bei 10-30Mb (was zwar unwahrscheinlich bei einer Website ist, aber bei einem 3D Projekt mit WebGL oder Canvas, wo Texturen und viel Code geladen werden muss kann das durchaus vorkommen) wäre der Sinn vllt vorhanden.

    Liebe Grüße
  8. Autor dieses Themas

    php-test1

    Kostenloser Webspace von php-test1

    php-test1 hat kostenlosen Webspace.

    hackyourlife schrieb:
    Eine Ladeanimation wofür?

    Die Grafik ist normalerweise ein animiertes GIF das zur entsprechenden Zeit angezeigt wird und wenn das bestimmte Etwas fertig geladen worden ist wird sie wieder versteckt...

    // EDITː
    Fall du mit Ladeanimation meinst "Animation bis die Seite komplett geladen wurde":
    Erster Treffer bei Google: http://tecpath.com/loading-screen-mit-javascript/


    Die Webseite ist recht gut, aber wo soll ich den Javascript-Code einbinden?

    Beitrag zuletzt geändert: 16.9.2012 17:17:14 von php-test1
  9. In den Headbereich entweder als Datei:
    <html>
    <head>
    <title>javascript</title>
    <script language="javascript" src="deindateipfad.js"></script>
    </head>
    
    <body>
    </body>
    </html>



    oder direkt reinschreiben:
    <html>
    <head>
    <title>javascript</title>
    <script language="javascript">
    
    //dein Code
    
    </script>
    </head>
    
    <body>
    </body>
    </html>
  10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!