Zum Inhalt springen

Hintergrund für ganzes Frameset


Reindeer

Empfohlene Beiträge

Ich hab eine Seite zusammen gebaut, die als alt bewährtes dreier Framset aufgebaut ist.

Dann hab ich einen schönen Hintergrund gebastelt.

Das Problem ist wohl ganz einfach: an den Framegrenzen wird das Hintergrundbild abgeschnitten und im anderen Frame neu angefangen.

Gibt es eine Möglichkeit, ein Hintergrundbild hinter das ganze Frameset zu legen, so dass es nicht an den Grenzen abgeschnitten wird?

Link zu diesem Kommentar
Auf anderen Seiten teilen

Original geschrieben von Tobitobe

Ob das so ohne weiteres geht, weiß ich nicht.

Aber du kannst doch einfach das Bild in passende "Stücke" schnipseln (mit Photoshop z.B.) und die einzelnen Bildteile dann in die unterschiedlichen Frames legen.

Nicht besonders elegant, geht aber gut. :)

Das duerfte aber herbe Probleme ergeben, wenn die Seite in einer anderen, als von ihm getesteten Aufloesung angezeigt wird - es sei denn, er hat absolute Groessen vergeben...

Link zu diesem Kommentar
Auf anderen Seiten teilen

Das ist doch generell das Problem mit Hintergrundbildern.

Entweder man hat seine Seite auf eine Auflösung begrenzt oder man erstellt das Hintergrund variabel das es gekachelt gut aussieht.

Am besten probierst du folgendes aus:

In deiner CSS-Datei (falls du eine hast) schreibst du


BODY {

              Background-Attachment : fixed;

              Background-Image : url(pix/image.jpg);

}

Link zu diesem Kommentar
Auf anderen Seiten teilen

Danke Jungs und Mädels für Eure Kommentare.

Mein Frameset arbeitet mit absoluten Größen, weil das Logo im Kopf und die Links im Menü auch immer dieselbe absolute Größe haben.

Mit Tabellen ist deswegen blöd, weil ich dann jedes mal die ganze Seite neu laden muss, wenn ich hier nur den Hauptframe austausche.

Ich hab mir selber auch Gedanken gemacht und bin zu dem Schluss gekommen, wenn ich zwar eine Tabelle mache, den Hauptframe im <td> aber mit einem <iframe> mache, kann ich den Inhalt austauschen ohne den Rest neu zu laden, und das Hintergrundbild ginge zumindest über den Kopf und das Menü durch.

Merci, Reindeer

Link zu diesem Kommentar
Auf anderen Seiten teilen

Lass bloß das mit den iFrames, ausser du hasst alle Netscape-User.

Sowas macht man nie für einen relevanten Teil der Page.

Wo liegt das Problem, schneid den Hintergrund so zu, wie du ihn brachst und setz bgproperties="fixed" in den Body-Tag.

Apropos, ich find Websites mit Texturen als Hintergrund eh furchtbar. An deiner Stelle würd ich ne Standard-Farbe verwenden, dann hast du vielleicht auch Chancen, das das irgendjemand sehen will.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Ich hatte das mit dem iframe nicht wirklich vor. Wobei ein richtig programmierter iframe bei keinem Browser Probleme macht.

Das Problem an dem geschnittenen Bild ist (was ich aber jetzt trotzdem gemacht habe), dass der Netscape keinen Code interpretieren kann, der den Hintergrund watermarkt. Weder style noch bgproperties funktionieren. Außerdem hat der rechte Frame eine absolute Größe, der Linke ändert sich. D.h. es gibt genau eine Variante (ich hab 1024 mit IE gemacht) passt, bei allen anderen Varianten stimmen die beiden Hintergründe nicht zusammen. Mir ist das aber zu blöd, noch eine automatische Auflösungsanpassung oder weis der Geier was rein zu bauen.

Außerdem, für was der Aufwand, wenn sich Seiten mit Textur eh keiner anschaut. Ich klick auch immer sofort weg, wenn eine Seite keinen rein weißen Hintergund hat. Das was drauf steht, interessiert ja keinen.

Hast Du schon mal was von Grafikprogrammen gehört? Mit denen kann man Bilder so abschwächen, dass man einen darüber gelegten Text auch noch lesen kann.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Schon mal was von PHP gehört? damit kann man ohne viel aufwand Homepages erstellen, die so Käse wie Frames nicht mehr brauchen.

Man kann aber auch mit Frames ganz passable Homepages erstellen, wenn man PHP nicht drauf hat. Ohne ein bisschen Designverständnis gehts allerdings nicht.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Original geschrieben von jomama

Schon mal was von PHP gehört? damit kann man ohne viel aufwand Homepages erstellen, die so Käse wie Frames nicht mehr brauchen.

Man kann aber auch mit Frames ganz passable Homepages erstellen, wenn man PHP nicht drauf hat. Ohne ein bisschen Designverständnis gehts allerdings nicht.

Ich kapier nicht ganz was PHP mit Frames zu tun hat:confused:

Wen mann Frames richtig einsetzt kann man damit z.B. einen Frame links als Menü benutzen und bei Auswahl dort wird im rechten Frame der entspr. Inhalt angezeigt. Und dabei wird nicht immer das Menü neu geladen.

Mit PHP kannst du dynamisch eine Seite ausgeben (bzw. den Inhalt anpassen), aber was hat das z.B. mit o.g. Menü zu tun?

Link zu diesem Kommentar
Auf anderen Seiten teilen

  • 1 Jahr später...
Am besten probierst du folgendes aus:

In deiner CSS-Datei (falls du eine hast) schreibst du


BODY {

              Background-Attachment : fixed;

              Background-Image : url(pix/image.jpg);

}

Hallo...

ich greife jetzt nochmal hier ein altes Thema auf. Habe nämlich auch ein solches Problem mit meiner Seite.

Wenn ich es mit oben angegebenen Code versuche, klappt das nur jeweils mit einem Frame, nicht aber über alle drei Frames. Wenn ich für jeden Frame die CSS-Datei ändere, habe ich jeweils einen ganzen Hintergrund.

Wer hat hier eine Lösung für mich ?? :confused: :confused: :confused:

Link zu diesem Kommentar
Auf anderen Seiten teilen

Hallo,

der Ansatz mit CSS ist genau richtig, jedoch weiss der Browser nichts mit drei BODY-Tags. Er sieht immer nur einen für das ganze Frameset.

Du kannst das Problem umgehen indem du in jeder Frameset Seite (Logo, Nav und Inhalt) die jeweilige CSS-Classe definierst:

Hier Logo.htm:


<style type="text/css">

<!--

[B].bg_logo [/B] {

	background-attachment: fixed;

	background-image: url([B]logo.png[/B]);

	background-repeat: no-repeat;

}

-->

</style>

.

.

.mehr HTML....

.

[B]<body class="bg_logo">[/B]

Hier Nav.htm:

<style type="text/css">

<!--

[B].bg_nav [/B] {

	background-attachment: fixed;

	background-image: url([B]nav.png[/B]);

	background-repeat: no-repeat;

}

-->

</style>

.

.

.mehr HTML....

.

[B]<body class="bg_nav">[/B]

Hier Inhalt.htm:

<style type="text/css">

<!--

[B].bg_Inhalt [/B] {

	background-attachment: fixed;

	background-image: url([B]inhalt.png[/B]);

	background-repeat: no-repeat;

}

-->

</style>

.

.

.mehr HTML....

.

[B]<body class="bg_inhalt">[/B]

Das Hintergrundbild auf die grössen des Framesets auf drei Bilder zuschneidest...

und fertig...

Link zu diesem Kommentar
Auf anderen Seiten teilen

@ qbe :

Danke erstmal für Deine Antwort. Ich habe unabhängig von der CSS-Datei versucht, das Hintergrundbild auf drei Teile zurecht zu schneiden, leider hat das nicht so recht funktioniert. :(

Habe das Bild in Größe von 1024*768, habe es dann mit Paintshop Pro bearbeitet. Leider habe ich so kleine Übergänge. Vielleicht liegt es daran, das dann später im Browser die Größe des Bildes nicht wirklich 1024*768 ist oder doch?

Das mit der CSS-Datei probiere ich jetzt erstmal aus.

Grüße

Link zu diesem Kommentar
Auf anderen Seiten teilen

bildformat : 1024 x 768

Beispiel für die Teilbilder:

Logo (1024 x 80, bei den Koordinaten 0,0 anfangen zu schneiden)

Nav (100 x 688, bei den Koordinaten 0, 80 schneiden)

Inhalt (924 x 688, bei den Koordinaten 100, 80 schneiden)

aber das wirst du bestimmt richtig gemacht haben.

was viel wichtiger ist, bei den frame-tags den rahmen auszublenden, magrinwidth, marginheigt auf 0

sprich:


<frameset rows="80,*" cols="*" frameborder="yes" border="0" framespacing="0">

  <frame src="logo.htm" name="topFrame" frameborder="0" scrolling="auto" noresize marginwidth="0" marginheight="0" >

  <frameset cols="100,*" frameborder="NO" border="0" framespacing="0">

    <frame src="nav.htm" name="leftFrame" scrolling="NO" noresize marginwidth="0" marginheight="0" >

    <frame src="inhalt.htm" name="mainFrame" noresize marginwidth="0" marginheight="0" >

  </frameset>

</frameset>

Link zu diesem Kommentar
Auf anderen Seiten teilen

@ qbe :

Danke nochmals, hat jetzt viel besser geklappt mit den Übergängen.

Das einzige Problem was sich mir noch stellt ist, das man einen kleinen Rand sieht in den Übergängen zwischen den Frames. Dabei hab ich bei den Frame-tags den Rahmen ausgeblendet. Liegt es vielleicht doch am unsauberen Schnitt des Bildes ?

<frameset rows="166,*" cols="*" framespacing="0" frameborder="NO" border="0" >

    <frame src="top.htm" name="top" scrolling="NO" noresize marginwidth="0" marginheight="0">   

 <frameset rows="*" cols="228,*" framespacing="0" frameborder="NO" border="0">  

    <frame src="sitebar.htm" name="sitebar" scrolling="NO" noresize marginwidth="0" marginheight="0">  

    <frame src="main.htm" name="main" noresize marginwidth="0" marginheight="0"> 

   </frameset>

  </frameset>

Link zu diesem Kommentar
Auf anderen Seiten teilen

Das einzige Problem was sich mir noch stellt ist, das man einen kleinen Rand sieht in den Übergängen zwischen den Frames. Dabei hab ich bei den Frame-tags den Rahmen ausgeblendet. Liegt es vielleicht doch am unsauberen Schnitt des Bildes ?


<frameset rows="100, *" border="0">

  <frame src="top.html" name="top" noresize="noresize" frameborder="0">

  <frameset cols="250, *">

    <frame src="Navi.html" name="navi" noresize="noresize" scrolling="no" frameborder="0">

    <frame src="main.html" name="main" noresize="noresize" scrolling="auto" frameborder="0">


  </frameset>

  <noframes>

    <body>

      [No Frames Teil]

    </body>

  </noframes>

</frameset>

Hab damit auch sowas gemacht, und man sieht keinen Rand o.ä. . Das ganze als attachement: fixed und sieht aus wie ein Hintergrund.

Ich würde also sagen, es liegt am unsauberen Schnitt.

Link zu diesem Kommentar
Auf anderen Seiten teilen

@JesterDay :

Danke für Deine Antwort. Aber wenn ich mir die einzelnen Teile anschaue, ist es ein ganz sauberer Schnitt. Wenn ich alle drei Teile addiere, komme ich wieder auf meine 1024*768.

So ungenau wird PsP doch nicht schneiden oder?

Vielleicht liegt es auch an Dreamweaver MX, wenn ich mir die Eigenschaften des Framesets anschaue, zeigt er mir bei der Rahmenfarbe halt ein Grauton an, obwohl ich es im Code auch auf "0" gesetzt habe...

Hilfe !! :confused: :confused: :confused:

Link zu diesem Kommentar
Auf anderen Seiten teilen

Was für einen Rand siehst du denn? einen grauen? Könnte es sein, das deine Frames größer als die Hintergrund Bilder sind? Wenn du den Rahmen beim Frameset mal auf 1 setzt, ist der Rand dann immernoch zu sehen (neben dem Rahmen des Framesets)?

Ich hab meins von Hand gemacht, aber entscheidend ist eh der Quelltext, nciht was irgendein Programm anzeigt.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Inzwischen habe ich die Seite mit div's aufgebaut. Also ein div als Hintergrund, das das Hintergrundbild enthält, dessen Größe mit Javascript gleich der Fensterinnengröße gesetzt wird. Das Bild ist zwecks Ladezeit nur 50x100 und schaut natürlich bei hohen Bildschirmauflösungen entsprechend aus.

Die Bastelei mit einer Hintergrundtextur habe ich auch schon gemacht, aber das passt halt immer nur für eine Auflösung und auch nur für einen Browser, da der IE z.B. dickere Fensterränder hat als Netscape. Außerdem verschiebt es den Hintergrund beim Netscape beim Scrollen immer.

Ich hab das ganze aufgegeben.

Link zu diesem Kommentar
Auf anderen Seiten teilen

Die Bastelei mit einer Hintergrundtextur habe ich auch schon gemacht, aber das passt halt immer nur für eine Auflösung und auch nur für einen Browser, da der IE z.B. dickere Fensterränder hat als Netscape. Außerdem verschiebt es den Hintergrund beim Netscape beim Scrollen immer.

Ich hab das ganze aufgegeben.

Ich hab meinen Hintergrund auf 1280x 1024 ausgelegt, er passt also für alles darunter bis zu der Größe. Das wird erstmal ne Weile reichen, der Rahnen des Browsers und die Toolbars etc machen den Inhalt den man sieht eh was kleiner als die Bildschirmauflösung.

Der Hintergrund bei Netscape bleibt mit CSS stehen (ok, 4.7x weiss ich nicht. Ich meinte die Mozilla Abkömmlinge). du darfst nur nicht die reine IE-Lösung verwenden.

Ok, braucht ein paar sek. bei mir. Also nur der Hintergrund schätze mal... 15-20 sek. bei 28.8er Verbindung (bekommt man im Programm angezeigt, Schätzwert für ne 28.8er). Da die meisten eh mehr haben heute ist mir das egal, und es war ne Seite für ne Bekannte, nicht für ne Firma o.ä. Ich denke damit kann man leben.

Edit, der Hintergrund ist halt schon "was besonderes" da, deswegen schon was aufwendiger...

Link zu diesem Kommentar
Auf anderen Seiten teilen

Also jetzt driften wir schon wieder vom Thema ab.

Ich habe die Hintergrundbilder genau zu geschnitten. Die Frames sind ebenfalls in der selben Größe wie die einzelnen Bilder. Und immernoch bekomme ich einen Rahmen angezeigt.

Hilfe !!!!

<frameset rows="168,*" cols="*" framespacing="0" frameborder="no" border="0">

<frame src="top.htm" name="top" scrolling="NO" noresize marginwidth="0" marginheight="0"> 

<frameset rows="*" cols="228,*" framespacing="0" frameborder="NO" border="0">

 <frame src="sitebar.htm" name="sitebar" scrolling="NO" noresize marginwidth="0" marginheight="0"> 

<frame src="main.htm" name="main" frameborder="NO" border="0" noresize marginwidth="0" marginheight="0">    </frameset>  </frameset>  <noframes>

<body>

 </body>

</noframes>

hier mal gucken !

Link zu diesem Kommentar
Auf anderen Seiten teilen

Dein Kommentar

Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.

Gast
Auf dieses Thema antworten...

×   Du hast formatierten Text eingefügt.   Formatierung wiederherstellen

  Nur 75 Emojis sind erlaubt.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Editor leeren

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

Fachinformatiker.de, 2024 by SE Internet Services

fidelogo_small.png

Schicke uns eine Nachricht!

Fachinformatiker.de ist die größte IT-Community
rund um Ausbildung, Job, Weiterbildung für IT-Fachkräfte.

Fachinformatiker.de App

Download on the App Store
Get it on Google Play

Kontakt

Hier werben?
Oder sende eine E-Mail an

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

×
×
  • Neu erstellen...