Gif nicht ausgeblendet trotz Aufruf .fadeOut Befehl

Ich versuche, ein Gif zu bekommen, dass ich nach dem Laden der Seite ausblenden muss, aber ich habe nicht viel Glück.Gif nicht ausgeblendet trotz Aufruf .fadeOut Befehl

Ich möchte das Overlay, das einen weißen Hintergrund und das GIF hat, in Transparenz verschwinden lassen, nachdem alles andere auf der Seite geladen und bereit ist, gesehen zu werden.

Unten ist mein Code, und auch ein Link zu einer Seite, wo ich es testen habe:

Link to test code

irgendwelche Ideen?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script 
      src="https://code.jquery.com/jquery-3.1.0.slim.min.js" 
      integrity="sha256-cRpWjoSOw5KcyIOaZNo4i6fZ9tKPhYYb6i5T9RSVJG8=" 
      crossorigin="anonymous"></script> 
<div id="overlay"> 
<img src="https://www.isostech.com/wp-content/uploads/2015/04/loader.gif" alt="Loading" /><br/> 
Loading... 
</div> 
Hello World! 

<script> 
$(window).load(function(){ 
$('#overlay').fadeOut(); 
}); 
</script>

Und die CSS:

#overlay { 
    background-color: white; 
    color: #666666; 
    position: fixed; 
    height: 100%; 
    width: 100%; 
    z-index: 5000; 
    top: 0; 
    left: 0; 
    float: left; 
    text-align: center; 
    padding-top: 25%; 
}

Quelle

2016-08-02 Jack Gleeman

Sie haben zwei Versionen von jQuery hinzugefügt. Entfernen Sie einen und es funktioniert gut: https://jsfiddle.net/pnzqau7c/4/ –

perfekt. Kannst du das unten setzen, damit ich dich als richtig markieren kann? –

Das ist in Ordnung - ich würde nur die Frage löschen, da das Problem durch eine Aufsicht verursacht wurde, die wahrscheinlich niemandem in der Zukunft helfen wird. –

Sie verwenden, um mehrere Versionen von jQuery. Wenn Sie entweder das Include für jQuery 3 löschen oder die folgende Änderung vornehmen, funktioniert es.

Ich trug vor kurzem zu document-ready handlers in den SO: Text & Tabellen, die hier gilt, und ich denke, dass viele nicht erkennen, wie sie zu jQuery wechseln 3.

jQuery(function($) { 
    // Run when document is ready 
    // $ (first argument) will be internal reference to jQuery 
    // Never rely on $ being a reference to jQuery in the global namespace 
});

Alle anderen Dokument-ready-Handler in jQuery sind veraltet 3.0.

Die Verwendung dieses doc-ready-Handlers funktioniert auch, wenn Sie beide jQuery-Includes im Code belassen.

Quelle

2016-08-02 15:23:27 amflare

Gif nicht ausgeblendet trotz Aufruf .fadeOut Befehl

Antwort

Verwandte Themen