Wie kann ich dafür sorgen, dass meine Einblendanimation nur dann abgespielt wird, wenn Sie die Website zum ersten Mal öfCSS

CSS verstehen
Anonymous
 Wie kann ich dafür sorgen, dass meine Einblendanimation nur dann abgespielt wird, wenn Sie die Website zum ersten Mal öf

Post by Anonymous »

Ich bin gerade dabei, einen kleinen Prototyp eines Kurzgeschichten-Blogs zu erstellen. Ich möchte die Stimmung der Website mit einer langsam eingeblendeten Übergangsanimation hervorheben, die dem Benutzer dann einen kurzen Einführungsabsatz zum Lesen gibt, bevor er wirklich auf die Website klickt.

Was ist das aktuelle Problem?
Wenn ich die Hauptwebseite lade, erkennt das Javascript nicht, dass es geladen ist, und sagt der Animation daher nicht, dass sie abgespielt werden soll, was zu einem konstanten Schwarz führt Bildschirm.

Gewünschtes Verhalten
Im Moment versuche ich, das JavaScript fertigzustellen, das die Animation in zwei Situationen abspielen lässt:
  • Wenn Sie die Website zum ersten Mal laden
  • Wenn Sie auf die Story-Titel klicken.

Code: Select all

/*Page Fader*/
function fadeInPage(){
if (!window.AnimationEvent) { return; }
var fader = document.getElementById('fader');
fader.classList.add('fade-out');
}

document.addEventListener('DOMContentLoaded', function() {
if (!window.AnimationEvent) { return; }
var anchors = document.getElementsByTagName('a');

for (var idx=0; idx[url=css/font-styles.css]


The Crypt Of Saint Novis



The Crypt of Saint Novis









Delight, in the pleasure of the macabre

Traveler[/url]

[img]assets/Trim.PNG[/img]

[h4]About[/h4]

Lorem ipsum dolor sit amet, consectuer adipiscing elit.  Maecenas porttitor congue massa.



[img]assets/Crypt_Front_Entrance.PNG[/img]






Was habe ich bisher versucht, um Abhilfe zu schaffen?
  • Ich habe allgemein versucht, dies zum Laufen zu bringen, indem ich es basierend auf
    erkennen ließ

    Code: Select all

    var anchors = document.getElementsByTagName('a');
    
    Es scheint jedoch nicht zu funktionieren. Das könnte möglicherweise damit zu tun haben, dass der Code nicht gut mit dem Basis-Fader interagiert, der gleichzeitig funktioniert und bei normalen Webseitenübergängen funktioniert.
  • Ich habe natürlich versucht, ihn dazu zu bringen, das Ereignis des Loaders zu erkennen, aber ich hatte auch kein Glück, obwohl ich denke, dass das daran liegt, dass ich etwas falsch mache und nicht daran, dass der Code lustig ist.
  • Ich auch Ich habe meine Anmerkungen zu Javascript durchgesehen, um zu versuchen, das Problem weiter zu diagnostizieren, und um grundlegenden Pseudocode für das zu schreiben, was es sehen und hören sollte, damit die Animation bei Bedarf abgespielt werden kann.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post