Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Parallax Hintergrund Effekt NOF 2015
#1
Guten Tag allerseits,

Mein Problem betrifft: Tutorial Parallax Hintergrund Effekt - hier in NOF 2015 
Habe alles gemäß den Anweisungen im Tutorial eingerichtet, funktioniert auch - aber:
Hintergrundbild ist exakt 800px auf 444px.
Layoutbereich: 800px auf 444px.
Trotzdem wird das Bild unten abgeschnitten, egal wie große der Bildschirm gezogen wird.
Was kann ich tun?

http://www.smaspi.com/Muster/html/jchknof.html

Mit bestem Dank im Voraus für ein Lösung.

Christopher
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
Hallo Christopher,

schön, dass Du den Weg ins Forum gefunden hast :hallo:

Zunächst solltest Du sämtliche Frames abschalten - Frames sind der Anfang allen Übels:

Hier ist Deine "Body" Seite (ohne Frame):

http://www.smaspi.com/Muster/html/body_jchknof.html

Du gibst im Body an, dass die Breite (width) 100% sein soll (am <body> Tag darfst Du bei NOF gar nichts ändern :eek: ):

Zitat:<body style="height: 100%; background: transparent none repeat-y fixed center; width: 100%;" class="nof-centerBody">

... also wird die Höhe vom Layout-Bereich, da dieser auf 440px in der Höhe begrenzt wurde ins Verhältnis zur Breite von 100% gesetzt (die ja, je nach Bildschirm, ganz unterschiedlich ist). Dann steht das Hintergrundbild auf "cover". Dieser CSS-Anweisung (cover = bedecken) wird das Bild so vergrößern, z.B. von 800px auf 1920px (meine Bidschirmauflösung) um eben den gesamten Bereich zu bedecken. Das hat zur Folge, dass in der Höhe ein beträchtlicher Teil "abgschnitten" wird, da das Bild sonst komplett verzerrt werden würde.

Zitat:<div id="LayoutBereich1" class="nof-lyr nof-fullwidth nof-clearfix" style="height:440px;background-size: cover; background-image: url('../assets/images/Berg800px440px.jpg'); background-repeat: no-repeat; background-attachment: scroll; background-position: top">&nbsp;</div>

Wenn das über die gesamte Breite gehen soll, dann kannst Du das mittels NOF nicht beeinflussen, das ist in meinem Tutorial auch nicht anders.

http://www.nof-tutorials.com/Responsive-...-Parallax/

... dadurch, dass der Hintergrund fixiert wird (das hast Du gar nicht), entsteht eben der Parallax-Effekt. Dann sieht man (eventuell) beim Scrollen eben auch die gesamte Höhe vom Hintergrundbild.

Du hast aber eigentlich auch alles falsch gemacht, gucke Dir mein Tutorial nochmals an. Ich verwende auch keinen Layoutbereich, sondern ein Textfeld.

http://www.nof-tutorials.com/Responsive-...orial.html

Das alles ist mit NOF mühselig bis (fast) unmöglich. NOF ist um Jahrzehnte veraltet, nicht responsive und ich kann Dir nur raten auf eine responsive Software, wie z.B. "Mobirise" umzusteigen.

Hier einige Eindrücke meiner Tutorial-Seiten, die mit "Mobirise" entstanden  sind:

http://www.mobirise-tutorials.com/

Für den Parallax-Effekt gibt es in Mobirise einfach einen Schalter für "ein/aus".
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Guten Tag Tommy,

herzlichen Dank für die informative Antwort. Habe ich bereits entschieden, aus NOF auszusteigen und sehe mir im Moment Mobirise an. Dein dortiges Tutorial ist noch dünner als das in NOF. Gibt es ein Handbuch für Einsteiger und html-Laien zu Mobirise (online)? Gibt es ein Mitgliederforum in Mobirise?

Besten Dank im Voraus für Deine Hilfe.
Christopher
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
Moin,

bin zwar nicht Tommy,

Ein Forum gibt es in englisch, deutsch wird dort aber auch verwendet.
https://forums.mobirise.com/

Ein Mobi- Handbuch git es meines Wissens nicht.
Tommy's MobiForum ersetzt aber allemal ein Handbuch.
Siehe Signatur von Tommy

Ps. Die Mobisoftware gibt es komplett in deutsch....
Kompatibilitätsmöglichkeiten mit Mobi4  |   AMP-Templates Kompatibilität

WIN 10/Alle Browser/AdobePhotoshop/
Mobirise 4/AMP, alle Templates/Kaspersky
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
(12.12.2018, 13:55)jchk schrieb: Dein dortiges Tutorial ist noch dünner als das in NOF.

... "noch dünner" finde ich eine starke Behauptung :D

Immerhin habe ich die mit Abstand größte Tutorial-Seite weltweit zu NOF mit einigen Tausend Seiten, die über 4GB Dateigröße am Server haben :eek:

Du wirst nichts finden, was ausführlicher als meine Tutorials sind und weit über die Möglichkeiten von NOF hinausgeht.

Für Mobirise benötigt man eigentlich keine Tutorials, da Mobirise absolut selbsterklärend ist und eben auch auf Deutsch umstellbar.
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#6
Sorry Tommy,

"noch dünner" war temporär und nicht inhaltlich gemeint, also ich wollte sagen: Dein Mobirise-Tutorial ist im Moment noch dünner als das sehr, sehr, sehr, sehr dicke NOF-Tutorial. Ich hoffe jetzt ist es deutlich, daß ich keinerlei Geringschätzung Deiner Arbeit im Sinne hatte - im Gegenteil.

Mit bestem Gruß
Christopher
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#7
... alles gut Smiling

... dennoch - so konnte ich das nicht stehen lassen, denn das kratzt an meinem Ego :D
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#8
Moin!


Zitat:Dein dortiges Tutorial ist noch dünner als das in NOF.

Ich darf hinzufügen, dass hier in der NOF-Schule umfangreiche Tutorials zu NOF (Alles anders als dünn), tausende von Beiträgen  und mittlerweile eine große Datenbank zur Lösung von Mobirise-Aufgaben - die größtenteils von unserem Tommy geliefert wurde - zu finden sind.

Für die Grundfunktionien von Mobirise ist ein Tutorial nicht erforderlich. Probieren geht da über studieren. Wink
Lieben Gruß
Barbara
--------------
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#9
Ich habe mir den Beitrag jetzt mehrmals durchgelesen und ich denke, er hat vielleicht gemeint:
Das Mobirise-Tutorial ist zur Zeit noch kleiner als das NOF-Tutorial. Es wird noch dauern, bis sich die Größenverhältnisse umkehren.
Bessere Schritt-für-Schritt-Anleitungen als von Tommy gibt es nicht! thumbs up
Keine Zeit, muss Haare machen!
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#10
Moin

die Größe ist doch völlig unwichtig, auf den Inhalt kommt es doch an!
Und da gibt es doch weit und breit nichts Vergleichbares, als das von Tommy! Kussmund
Kompatibilitätsmöglichkeiten mit Mobi4  |   AMP-Templates Kompatibilität

WIN 10/Alle Browser/AdobePhotoshop/
Mobirise 4/AMP, alle Templates/Kaspersky
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Hintergrund Fotos bei FancyZoom surfer32 4 63 Vor 7 Stunden
Letzter Beitrag: surfer32
  NOF 2015 Cmike 5 117 17.05.2019, 20:14
Letzter Beitrag: Wolfgang Z
  Voreinstellungen in NOF 2015 harry 71 798 14.05.2019, 10:27
Letzter Beitrag: harry
  NOF 2015 Installationsdatei Download Niklas92 11 2.180 30.04.2019, 16:19
Letzter Beitrag: docmikel
  NOF 2015 defekt Gerdl 1 102 27.03.2019, 08:39
Letzter Beitrag: Wolfgang Z
  Video-Hintergrund läuft nicht mehr stobi_de 6 293 14.11.2018, 07:10
Letzter Beitrag: Tommy Herrmann
  Sticky navigation bars in NOF 2015 BEEJ 2 297 06.10.2018, 09:35
Letzter Beitrag: Martin73
  NOF 2015 startet nicht WolfgangT 8 568 01.10.2018, 12:53
Letzter Beitrag: barbara0701
  NOF 2015 startet oder auch nicht Wellness69 15 817 28.08.2018, 15:31
Letzter Beitrag: Wellness69
  Alte responsive Seiten mit parallax-Effekt stobi_de 4 441 05.07.2018, 15:33
Letzter Beitrag: Doris Rehhausen



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!