Wie kann ich mit jQuery ein Hintergrundbild zu dieser Seite hinzufügen?

Ich fand, was zu sein scheint, eine fantastische Open-Source-Node.JS Login-System auf GitHub. Es befindet sich here. Ich habe es auf meiner Website (cend.io) eingerichtet. Alles ist cool.Wie kann ich mit jQuery ein Hintergrundbild zu dieser Seite hinzufügen?

Nun, was ich tun möchte, ist ein gestrecktes, responsive Hintergrundbild auf der Hauptseite hinzuzufügen. Etwas wie this.

Was wäre die effizienteste Methode, dies angesichts der Komplexität des Node.JS-Anmeldesystems zu tun?

Vielen Dank im Voraus für Ihre Geduld.

Quelle

2016-04-01 cbclark

Keine Notwendigkeit jQuery zu verwenden, nur CSS verwenden, wie Sie es irgendwo anders. Der aktuelle Hintergrundgradient wird auf das Tag "body" in der Datei "style.css" angewendet. – APAD1

Schön. Ich fragte mich, ob das gemacht werden könnte. Was ist die Bedeutung der Datei style.styl? Es sieht aus wie eine CSS-Datei ohne so viel Syntax. Muss das auch angepasst werden? – cbclark

Sie sollten nur die Änderung in der Styl-Datei vornehmen, es ist die vorverarbeitete CSS-Datei, so dass jedes Mal, wenn Sie es kompilieren, die style.css-Datei mit dem überschrieben wird, was in der Stylus-Datei ist. – APAD1

Sie müssen nur diese zu CSS hinzufügen:

html { 
    background: url(images/bg.jpg) no-repeat center center fixed; // change to your own image 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

Dies wird ein ganzes Seite Hintergrundbild zum html Elemente hinzuzufügen.

Quelle

2016-04-01 16:27:47 aphextwix

Das funktioniert für mich. Ich musste den Code in das body-Tag stecken, anstatt html. – cbclark

@cbclark - Ja, 'Körper' wird auch funktionieren. Könnten Sie bitte meine Antwort akzeptieren? – aphextwix

Es sieht herrlich aus! [cend.io] (http://cend.io) – cbclark

Sie jQuery nicht brauchen, das Hintergrundbild einstellen kann mit reinem JavaScript wie folgt geschehen:

document.body.style.backgroundImage = "url('image.png')";

Quelle

2016-04-01 16:38:57

Cool, das scheint wirklich einfach zu sein. Ein Teil meiner Verwirrung rührt von der Tatsache her, dass es keine "index.html" -Datei gibt, mit der man arbeiten kann. Es sind alles .jade-Dateien im Serverordner. Würde diese Lösung noch funktionieren/würde sich der Code ändern? – cbclark

Warum überhaupt JavaScript verwenden, wenn Sie einfaches CSS verwenden können? – APAD1

@ Apad1 Er fragte, wie man jQuery verwendet, so dass ich eine Antwort in JavaScript gab; aber Ihr Recht, Sie könnten es in CSS tun, und Sie könnten jQuery verwenden, um die CSS ... –

Wie kann ich mit jQuery ein Hintergrundbild zu dieser Seite hinzufügen?

Antwort

Verwandte Themen