Hallo Bero,

vielen Dank für Deine Geduld und Deine ausführliche Anleitung. Deine Beispielseite mit dem fixierten Hintergrund ist genau das, was ich gerne hätte. Dennoch komme ich an einem Punkt Deiner Anleitung ins Stocken:

• Lege in dem Verzeichnis, in dem Deine Projektdatei liegt, ein Hilfsverzeichnis an, mit dem Namen "projekt_web_files". Für den Bezeichner "projekt" nimmst Du natürlich den echten Namen Deines Projekts.
  Nehmen wir an, Du hast Dein Projekt "back" genannt, dann muss das Hilfsverzeichnis "back_web_files" heißen.
  Der oben im Code gelb markierte Verweis auf das Verzeichnis "index_htm_files" ist korrekt. Auch wenn das HG Bild jetzt noch im Hilfsverzeichnis liegt, sorgt der WD beim Export dafür, dass es später korrekt abgelegt- und gefunden wird.
• Lege das vorbereitete Hintergrundbild "backgr.jpg" in das gerade erstellte Hilfsverzeichnis
• Exportiere das Projekt zum Test in ein Verzeichnis Deines PC und prüfe das Ergebnis
• Veröffentliche Dein Projekt
• Fertig

Normalerweise finde ich in dem Verzeichnis, in das ich mein Projekt exportiert habe zwei Einträge:

1. index_htm_files

2. index

Wo genau soll ich jetzt das Hilfsverzeichnis erstellen?

UND ... habe ich es richtig verstanden: Ich habe mein Projekt im WD mit dem Namen "Testseite" gespeichert. Der Hilfsordner muss also "Testseite_web_files" heißen ?

Ich freue mich jetzt schon auf Deine Antwort!!

Gruß

Stefan

[...] Wo genau soll ich jetzt das Hilfsverzeichnis erstellen? [...]

Hmmm, na da...

[...] habe ich es richtig verstanden: I[...] Der Hilfsordner muss also "Testseite_web_files" heißen [...]

Genau so muss er in Deinem Fall heißen

Viel Erfolg

Hallo Bero,

das mit dem Namen des Hilfsverzeichnises ist jetzt klar, aber muss ich den Ordner "Testseite_web_files" auf der Ebene neben den beiden anderen Einträgen 1) "index_htm_files" und 2) index als drittes Element dort einfügen, ODER gehört der Ordner "Testseite_web_files" in den Ordner "index_htm_files" ?

Vielen Dank für Deine Antwort

Gruß

Stefan

2x Nein!

Wie schon gesagt: Das Hilfsverzeichnis muss in dem Verzeichnis angelegt werden, in dem Du Deine Projektdatei abgelegt hast.

• Die Projektdatei ist die Datei, die der WD anlegt, wenn Du im Menü "Datei",  die Option "speichern"- oder "speichern als..." wählst
• Die Projektdatei hat immer die Endung ".web". In Deinem Fall heißt sie also "Testseite.web"
• Die Projektdatei wird vom WD in einem Standardverzeichnis gespeichert, Du kannst aber natürlich ein eigenes Verzeichnis dafür angeben.
  Welches Verzeichnis der WD automatisch benutzt, siehst Du, wenn Du den Menüpunkt "Datei - speichern als..." öffnest.
• In das so gefundene Verzeichnis gehört das Hilfsverzeichnis. Das ist völlig unabhängig vom Speicherort der exportierten Dateien/Verzeichnisse.

Probier's nochmal

Viel Erfolg

Hallo Bero,

geschaftt!!! , aber einen Haken hat die Sache dennoch, das Hintergrundbild ist in der Browser-Vorschau nämlich nicht als ganzes zu sehen. Ungefahr das untere Drittel wird abgeschnitten. Meine Idee: Dann schneid´doch einfach das untere Drittel des Ausgangsfotos ab .... allerdings schneidet der WD dann ein weiteres Drittel des Bildes ab.  Hast Du eine Idee, wo mein problem liegt und ob es sich beheben lässt? Das Hintergrundfoto sollte zu 100 Prozent zu sehen sein. Oder schafft das meine Version vielleicht doch nicht: Web Desinger MX Premium 8?

Viele Grüße

Stefan

[...] geschaftt! [...]

Gratuliere. Wie heißt es doch gleich: Gut Ding will Weile haben...

[...] das Hintergrundbild ist in der Browser-Vorschau nämlich nicht als ganzes zu sehen. [...]

Das wird mit den Ausgangsmaßen und/oder mit dem Seitenverhältnis des Hintergrundbildes zusammenhängen.

Hast Du mein Posting vom 22. 9. vollständig gelesen?

Wenn Du den markierten Tipp beherzigt hast, dann sollte das HG Bild formatfüllend angezeigt werden, so, wie in der Demo, die ich online gestellt habe.

[...] Oder schafft das meine Version vielleicht doch nicht [...]

Der WD ist an dem Problem absolut unschuldig. Für die Anzeige ist nur der Browser zuständig. In der Vorschau, die Du mit dem WD öffnen kannst, wird der Internet Explorer in einer abgespeckten Version benutzt.

Kontrolliere- und korrigiere ggf. die Ausgangsgröße des HG Bildes, dann sollte es klappen.

Viel Erfolg

Hallo Bero,

[...]Wenn Du den markierten Tipp beherzigt hast, dann sollte das HG Bild formatfüllend angezeigt werden, so, wie in der Demo, die ich online gestellt habe.[...]

[...]Kontrolliere- und korrigiere ggf. die Ausgangsgröße des HG Bildes, dann sollte es klappen.

Viel Erfolg

ich habe Deinen Tipp sehr wohl gelesen und auch umgesetzt, jedoch bleibt das Porblem, dass ca. das untere Drittel des Bildes nicht zu sehen ist. Das von mir verwendete Bild hat im Original 3072 mal 2304 Pixel, eine horizontale und vertikale Auflösung von 180 dpi und eine Bildtiefe von 24. Nachdem ich es über verschiedene Wege verkleinert habe (Image Resizer 4 oder auch über die Fotobearbeitung im Web Desigener) hat das Bild 1024 mal 768 Pixel, die restlichen Werte sind gleichgeblieben. Aber mit beiden Methoden kommen ich zu dem Ergebnis, dass das untere Drittel des Bildes fehlt, nachdem ich das bearbeitete Bild in das entsprechende Verzeichnis kopiert habe. Hast Du noch eine Idee, wo der Haken ist, bzw. wo ich möglicherweise etwas übersehen haben könnte?

Nochmals Danke für Deine Geduld!!

Gruß

Stefan

[...]} kommen ich zu dem Ergebnis, dass das untere Drittel des Bildes fehlt [...] Hast Du noch eine Idee [...]

Nicht so wirklich.

Denkbar wäre noch, dass der von Dir genutzte Browser das Problem macht. Da die von mir online gestellte Demo offenbar korrekt von Deinem Browser angezeigt wurde, scheidet er wohl ebenfalls aus dem "Kreis der Verdächtigen" aus.

Was bleibt, ist der Code selbst und/oder die Art der Einbettung.

Um in dem Punkt Sicherheit zu haben, solltest Du Dir hier die Projektdatei (inkl. Hilfsverzeichnis) herunterladen, die ich für die Demo benutzt habe. Öffne die Datei und lass den WD das Projekt exportieren. Nach einem Doppelklick auf die exportierte "index.htm" solltest Du das HG Bild formatfüllend sehen.

Wenn das so ist, musst Du die Implementierung des Codes in Deinem Projekt noch einmal prüfen. Bei der Gelegenheit kannst Du auch checken, ob Du an anderer Stelle im HTML Body- oder Head "Fremdcode" untergebracht hast, der ggf. die Funktion des neuen Codes stört...

Viel Erfolg

Hallo Bero,

ich habe die Vermutung, das Du mich möglicherweise etwas missverstanden hast. Aber Schritt für Schritt:

Ich habe mir Deine Prjektdatei geladen und anzeigen lassen. Dabei ist mir folgendes aufgefallen: Bei meinem 15 Zoll Monitor sieht das Hintergrundbild anders aus, als bei meinem Netbook-Monitor. Das Hintergrundbild ist zwar formatfüllend zu sehen, aber nicht der gesamte Inhalt des Originalbildes ist zu sehen. Das meinte ich, als ich schrieb, dass bei meinen Versuchen ca. das untere Drittel des Bildes fehlt. Konkret sehe ich auf dem 15 Zoll Monitor zum Beispiel im Vorschau-Fenster des WD (sowohl beim Firefox als auch beim IE) rechts oben und rechts in der Mitte zwei der dicken Äste aus dem Bild verschwinden und darunter sind nochmals zwei dickere Äste, die aus dem Bild ragen. Schaue ich mir aber (mit dem gleichen Monitor) Deine veröffentlichte Seite an, dann ist von den beiden zuletzt erwähnten Ästen nur noch ein kleinerer Teil zu sehen. Beim Monitor des Netbooks sehe ich diese beiden unteren, dickeren Äste zum Beispiel gar nicht.

Um es nochmal deutlich zu machen: in allen Ansichten ist zwar das Hintergrundbild formatfüllend, aber der sichtbare Inhalt unterscheidet sich; je größer der Monitor, desto mehr ist zu sehen.

Mein Anliegen ist aber: Unabhängig von der Größe des Monitors sollte der Inhalt des Bildes immer zu 100 %, fixiert und formatfüllend zu sehen sein. 

Lässt sich dieser Wunsch mit Deinem Code überhaupt realisieren?

Grüße

Stefan

[...] ich habe die Vermutung, das Du mich möglicherweise etwas missverstanden hast [...]

Mit der Vermutung liegst Du voll im Ziel.

[...] Unabhängig von der Größe des Monitors sollte der Inhalt des Bildes immer zu 100 %, fixiert und formatfüllend [...]

Mit den dann geltenden Einschränkungen ist auch das möglich...

[...] Lässt sich dieser Wunsch mit Deinem Code überhaupt realisieren? [...]

Ja, nach einer winzigen Anpassung eines Parameters (s. Screenshot)

Diese Variante habe ich gerade in die online Demo eingebaut, mit einem neuen Hintergrundbild (Testbild), an dem Du den Effekt sehr schön nachvollziehen kannst. (s. Screenshot)
Die entsprechend geänderte Projektdatei liegt hier zum Download bereit.

Nachteil dieser Version ist die Verzerrung der Proportionen des HG Bildes, bei unterschiedlichen Bildschirmgrößen. Das lässt sich in dem Fall nicht mehr kompensieren, aber Du hast immer ein 100% Bild, sowohl vertikal als auch horizontal.

Viel Erfolg

Hallo Bero,

vielen Dank für Deine Hartnäckigkeit!!!!

Du hast in der Tat das geschafft, was ich gerne haben möchte!

[...]Nachteil dieser Version ist die Verzerrung der Proportionen des HG Bildes, bei unterschiedlichen Bildschirmgrößen. Das lässt sich in dem Fall nicht mehr kompensieren, aber Du hast immer ein 100% Bild, sowohl vertikal als auch horizontal[...]

Diese Verzerrung lässt sich nach langem ausprobieren etwas abmildern, wenn das Foto im Ausgangsformat 4:3 mit Hilfe zum Beispiel dieses Programms...

http://www.chip.de/downloads/Photoscape_31968029.html

...auf das 16:9 Format beschnitten wird. Dann fällt die Verzerrung nicht ganz so auf. Vielleicht ist das aber auch nur bei mir (15 Zoll Monitor) der Fall. Zusatzliche Erfahrungen mit unterschiedlichen Bildschirmgrößen könnten da weiterhelfen.

An dieser Stelle möchte ich mich aber ganz herzlich bei Dir Be-Ro für Deinen "Einsatz" und Deinen Lösungsvorschlag bedanken

Viele Grüße

Stefan

Tut mir Leid, dass ich ein altes Thema ausgrabe, zu dem es auch schon viel zu lesen gibt. Jedoch komme ich mit dem Problem des automatisch anpassenden Hintergrundes einfach nicht weiter. Ich erstelle derzeit für, bzw. mit meiner  Freundin eine Website.

Sowohl die vorläufige Seite, als auch die spätere Startseite sollen ein formatfüllendes Bild als Hintergrund haben, welches sich natürlich auch automatisch anpassen soll.

Ich habe mich eigenlich genau an die Anweisungen aus dem Threat gehalten, jedoch will es partout nicht klappen. Ich habe auch selber schon mit Notepad+ versucht, die CSS Codes einzufügen, aber auch das bringt keinen Erfolg. Ich weiß wirklich nicht, welchen Fehler ich mache.

Um diese Seite handelt es sich:

www.imkehoefker.com

Ich hoffe ihr könnt mir weiterhelfen!

Viele Grüße

Marcus

@abacaxi3000

[...] Tut mir Leid, dass ich ein altes Thema ausgrabe [...]

Das ist eigentlich nur ein Problem für Dich selbst, weil solche alten Sachen nur noch der Threadersteller sieht und die Mitglieder, die hier geantwortet haben.
Das reduziert die Chance auf eine "sachdienliche Antwort" erheblich...

[...] Ich habe mich eigenlich genau an die Anweisungen aus dem Threat gehalten [...]

Vermutlich nicht so ganz genau...

Im Verzeichnis "index_htm_files" der von Dir verlinkten Seite fehlt die Datei "backgr.jpg". Dafür finden sich 2 andere Bilder ("16.jpg" und "17.jpg"), die den gewünschten Hintergrund in unterschiedlichen Größen zeigen.

Den JS Code aus meinem Kommentar hast Du zwar korrekt eingebunden (im Screenshot grün markiert), zusätzlich hast Du aber an 2 anderen Stellen (Hintergrund Ebenen?) die o. a. Bilder 16 und 17 als Background eingebunden (im Screenshot rot markiert).

Abhilfe:

• Entferne im WD Editor die Bilder aus den Hintergrund Ebenen.
• Lege ein Hilfsverzeichnis zu Deinem Projekt an, wie hier beschrieben.
• Füge das Hintergrund Bild "backgr.jpg" in das Hilfsverzeichnis ein
• Exportiere/veröffentliche Deine Seite
• Freue Dich, dass es geklappt hat.

Viel Erfolg

Danke ReRo in vielerlei Hinsicht. Das alte Themen nicht oben auftauchen wusste ich gar nicht.

Ich habe deine Ratschläge befolgt, jedoch ist das Ergebnis, dass nun die Seite weiß ist, ohne Hintergrund, aber sich diese auch nicht anpasst? Immernoch ein Fehler in der html Datei? Tut mir Leid, dass ich so unbeholfen reagiere. Ich arbeite mich gerade erst in die gesamte Thematik ein...

Viele Grüße, Marcus

@abacaxi3000

[...] jedoch ist das Ergebnis, dass nun die Seite weiß ist [...]

Nicht ganz...
Du musst nur eine Weile warten, dann füllt sich der Hintergrund mit dem von Dir gewählten Bild.

Die Zeitverzögerung liegt an der Größe des Bilds, das immerhin ca. 14 MB an Speicher im aufrufenden Browser benötigt. Was bei einer netto Größe von 1,65 MB nicht verwundert...

Bei dem gewählten Motiv ist IMHO eine deutliche Reduzierung der Größe/Auflösung kein Nachteil. Wenn Du das Bild z. B. auf 1024 x 768 px skalierst, erhältst Du eine Dateigröße von 189 KB, also etwa 1/10 der Ursprungsgröße. Der Seitenaufbau wird damit erheblich schneller ablaufen

[...] jedoch ist das Ergebnis, dass nun die Seite [...] sich [...] auch nicht anpasst [...]

Das kannst Du leicht ändern, wenn Du im CSS Code die Breite und die Höhe des Hintergrundbilds anders definierst.

Aktuell benutzt Du für beide Ausrichtungen das Attribut "auto". Wenn Du für die Breite ("width")  stattdessen "100%" einsetzt, dürfte das Ergebnis für Dein Vorhaben schon sehr viel besser aussehen.

Das Ergebnis kann danach so aussehen:

Probier's nochmal

Viel Erfolg

Hallo BeRo,

vor einiger zeit habe ich diesen Thread eröffnet. Im Zusammenhang mit einem anderen Thread / einer anderen Seite habe ich jetzt noch mal hier etwas herumgespielt. Auch ich habe das Problem, dass ich nach dem Veröffentlichen statt eines background-Bildes nur einen weißen Hintergrund sehe. Hier ist es zu sehen. Kann es sein, dass der WD10 Premium etwas gegen diese Art und Weise hat ein Bild in den Hintergrund zu setzen? Theoretisch wäre das ja auch über "pasteboard background / Arbeitsbereichhintergrund / Broweserfenster füllen" möglich.

Ich hatte mehr als 15 Min das Browserfenster geöffet -- leider hat sich in diser Zeit kein Bild geladen! Was läuft schief .. ich weiß, dass es früher immer geklappt hat! Übrigens in der Vorchau des WD erscheint das Hintergrundbild einwandfrei! Wieso klappt bei Dir, was bei uns nicht klappt?

Grüße

Stefan

@SteHoy

[...] leider hat sich in diser Zeit kein Bild geladen! [...]

Der Grund ist simpel: Auf dem Webserver liegt kein Hintergrundbild.

[...] Übrigens in der Vorchau des WD erscheint das Hintergrundbild einwandfrei! [...]

Das ist ein gutes Indiz für die Ursache des Problems.

Die Lösung ist auch in Deinem Fall dieselbe, die ich weiter unten @abacaxi3000 empfohlen habe:

• Lege ein Hilfsverzeichnis zu Deinem Projekt an, wie hier beschrieben.
• Füge das Hintergrund Bild "backgr.jpg" in das Hilfsverzeichnis ein
• Exportiere/veröffentliche Deine Seite
• Freue Dich, dass es geklappt hat.

Alternativ kannst Du natürlich auch die Hintergrundgrafik manuell (z. B. mit FileZilla) auf den Webserver schieben, nachdem Du die Site veröffentlicht hast...

Viel Erfolg

Hi Bero,

ich habe den Fehler entdeckt ... es lag, wo ich ihn überhaupt nicht vermutet habe ... Beim Speichern meines Hintergrund-Bildes hat windows 8.1. die Endung der Datei von sich aus GROß geschrieben. Also backgr.JPG

Warum ?? Keine Ahnung -- aber im Code steht eine KLEINE Endung backgr.jpg. Das hat den Fehler ausgemacht! Jetzt sehe ich das Bild!!

Ich habe also im Code der Seite die Endung auch großgechrieben ".JPG" -- dann funktioniert es!