TP Underground Lounge 07/08
-


Hinweise


Antwort
 
LinkBack Themen-Optionen Thema durchsuchen Thema bewerten
Alt 15.05.2004, 12:57   #1
TP-Junior
 
Registriert seit: May 2004
gz09 macht alles soweit korrekt

html auf bild


hallo,
ich habe ein frage wie ich folgendes designtechnisch realisieren soll
also unten seht ihr ein schema von einem bild dieses bild ist ein 3 teilbereiche gegliedert 2x nav und einmal in der mitte das fenster wo der eigentliche inhalt hin soll..
nur wie mach ich das nun dass ich auf dieses bild sozusagen 3 html bereiche setzen kann, die auch noch immer richtig angezeigt werden, d.h. mit verschiedenen browsern und auflösungen..
das bild wird dann im browser zentriert was die ganze sache nochmal erschwert..

ich hab versucht das bild mit fireworks zu slicen, das problem ist nur dass ich da nicht den hintergrund transparent haben kann, was aber sein muss da im main teil ein hintergrund bild drin ist, das man auch noch sehen müsste..

mit flash würde das wohl gehen, gibts aber auch eine saubere html lösung?

gz09 ist offline   Mit Zitat antworten


Alt 15.05.2004, 14:46   #2
TP-Specialist
 
Benutzerbild von Hausmaster
 
Registriert seit: Nov 2003
Ort: Wien
Hausmaster hilft, wo's gehtHausmaster hilft, wo's gehtHausmaster hilft, wo's geht
mit farmes bzw i-frames?
-wenn das nicht geht eine hp mit i-frae bauen und dieswe in ein popup öffnen!
__________________
deviantart.com

"Das schwächere Geschlecht ist das stärkere wegen der Schwäche des stärkeren für das schwächere." - Greta Garbo
Hausmaster ist offline   Mit Zitat antworten
Alt 15.05.2004, 15:03   #3
TP-Junior
 
Registriert seit: May 2004
gz09 macht alles soweit korrekt
danke für deine antwort..
2 fragen noch dazu
-kann man iframes auf das bild quasi raufsetzen oder muss man das layout als hintergrund in die seite einfügen..?
-werden iframes inzwischen von allen browsern der neuen generation unterstützt?
gz09 ist offline   Mit Zitat antworten
Alt 15.05.2004, 16:51   #4
TP-Specialist
 
Benutzerbild von Hausmaster
 
Registriert seit: Nov 2003
Ort: Wien
Hausmaster hilft, wo's gehtHausmaster hilft, wo's gehtHausmaster hilft, wo's geht
also:
zu 1: ich verstehe das so: du magst wissen ob das i-frame einen hintergrund braucht...? - wenn ja dann braucht e glaub ich einen BG... wenn aber der hintergrund deiner seite, wo das i frame drauf ist nur 1ne farbe ist kannst du ja dem iframe die selbe farbe geben...
mit i.frame meine ich ein "fenster" indas seiten geladen werden; d.h. kannst du ja deine seite die du reinlädst ans designe anpassen...
zu 2 soweit ich weiss können das alle anzeigen bin mir aber nicht sicher...
__________________
deviantart.com

"Das schwächere Geschlecht ist das stärkere wegen der Schwäche des stärkeren für das schwächere." - Greta Garbo
Hausmaster ist offline   Mit Zitat antworten
Alt 15.05.2004, 17:09   #5
TP-Specialist
 
Benutzerbild von Hausmaster
 
Registriert seit: Nov 2003
Ort: Wien
Hausmaster hilft, wo's gehtHausmaster hilft, wo's gehtHausmaster hilft, wo's geht
schaumal:
ich habe ein beispiel gebastelt...
http://www.gerald.gmxhome.de/iframe_beispiel.html
__________________
deviantart.com

"Das schwächere Geschlecht ist das stärkere wegen der Schwäche des stärkeren für das schwächere." - Greta Garbo
Hausmaster ist offline   Mit Zitat antworten
Alt 15.05.2004, 18:40   #6
TP-Junior
 
Registriert seit: May 2004
gz09 macht alles soweit korrekt
hi
danke für deine mühe..
das problem ist eben, dass der hintergrund im main teil nicht aus einer farbe sondern aus einem bild besteht, also nicht einfarbig ist.. evtl. muss ich das wohl noch in ein einfarbiges hintergrundbild ändern, oder im iframe ne page laden die so ein hintergrundbild hat, das würde ja auch gehen,obwohls dann halt netmehr derselbe effekt ist..

ich weiss nicht ob man es mit div container so gut hinbringen könnte? damit würde die transparenz sicher gehen..
aber ich hatte in der vergangenheit dann immer mühe damit, weil es mir die bei anderen auflösungen immer verschoben hat, was dann schlecht aussah..
gz09 ist offline   Mit Zitat antworten
Alt 15.05.2004, 20:23   #7
TP-Senior
 
Registriert seit: Mar 2004
freaksta macht alles soweit korrekt
Ich oersönlich halte garnicht so viel von Frames bzw. iFrames. Hätte ich dieses Design konzipiert würde ich es mit Tabellen realisieren. du erwähntest ja das du mit fireworks arbeitest oder? Wenn ja kannste dort auch schon die einteilungen machen für die Tabellen. wichtig ist dann nur das du daruaf achtest das die tabellen folgende eigentschaften haben:
PHP-Code:
cellpadding="0" cellspacing="0" 
und wenn du willst das nur der main teil scrollbar ist dann machste über den main teil nen div tag. sähe dann so aus
PHP-Code:
<div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; left: 240px; top: 70px;"></div
das width steht für die breite und das height für die höhe also so wie du es bisher gewohnt bist.
die werte von left und top sind die abstände von links und von oben. also so würde ich es realisieren. funktioniert auch eigentlich mit alles browsern. nur mit nem mac hab ich noch net probiert
freaksta ist offline   Mit Zitat antworten
Alt 15.05.2004, 20:58   #8
TP-Veteran
 
Benutzerbild von jonemo
 
Registriert seit: Dec 2002
Ort: london
jonemo macht sich hier sehr viel Mühe
warum das bild nicht einfach per background-image dahinter machen?
__________________
the daily london photo
jonemo ist offline   Mit Zitat antworten
Alt 15.05.2004, 21:32   #9
TP-Specialist
 
Benutzerbild von Hausmaster
 
Registriert seit: Nov 2003
Ort: Wien
Hausmaster hilft, wo's gehtHausmaster hilft, wo's gehtHausmaster hilft, wo's geht
oder per i-frame und in photoshop den bg ausschneiden und als fixen bd angeben....
__________________
deviantart.com

"Das schwächere Geschlecht ist das stärkere wegen der Schwäche des stärkeren für das schwächere." - Greta Garbo
Hausmaster ist offline   Mit Zitat antworten
Alt 15.05.2004, 22:05   #10
TP-Specialist
 
Benutzerbild von Paco
 
Registriert seit: Sep 2001
Ort: Rhein-Main
Paco macht sich hier sehr viel Mühe
Man kann jedes Layout ordentlich slicen und dann per Tabellen (einfacher) oder Container wieder zusammenflicken und ein Iframe plazieren. Das ganze kannst du in allen beiden Methoden zentrieren. Und falls du nicht viel Text im Main hast, kannst du Dir auch den iframe sparen
Paco ist offline   Mit Zitat antworten
Alt 16.05.2004, 01:43   #11
TP-Insider
 
Benutzerbild von lipsum
 
Registriert seit: Feb 2004
Ort: zinnwald / osterzgebirge
lipsum hilft, wo's gehtlipsum hilft, wo's gehtlipsum hilft, wo's geht
hallo gz09,

wie in den vorherigen beiträgen schon gesagt wurde, ist es wohl am besten, wenn du dein design in fireworks ordentlich slicest und dann die seite auf tabellenbasis aufbaust (obwohl tabellen eigentlich nicht zu layoutzwecken da sind ).

beim export der dateien legt fireworks die grafiken ja standardmäßig als bilder in die tabellenzellen. bei teilen des layouts, in denen du noch html drüberlegen willst, solltest du händisch in deinem editor die entsprechenden grafiken zu einem hintergrundbild ändern. da die gesamte tabelle ja auf festen pixelwerten basiert, gibt es da auch keine probleme bezüglich wiederholung der hg-bilder.

nun zu deinem mittelteil:
je nachdem, was du da als hintergrundbild haben willst, nimmst du die grafik aus dem slice, oder eben eine andere. durch das slicen hat die "main"-zelle ja praktischerweise gleich feste pixelwerte für breite und höhe (die wir gleich noch brauchen). in diese zelle fügst du einfach ein "div" ein, so wie weiter oben von freaksta vorgeschlagen - nur mit einem kleinen unterschied...
HTML-Code:
<div style="height:100%; width:100%; overflow:auto;">
je nach länge deines späteren inhaltes bekommt dieses "div" dann einen scrollbalken oder nicht. durch die größenwerte der tabellenzelle und die prozentuale größenangabe des div wird dieses immer so groß wie die zelle. die fehlende absolute positionierung läßt das div auch bei unterschiedlichen auflösungen immer im mainbereich erscheinen.

das problem sind natürlich nun die inhalte des mainbereiches. am besten kommst du da mit php, indem du in den div deine anderen inhalte includest. alternativ kannst du per javascript mehrere divs mit den entsprechenden inhalten ein- und ausblenden.

soweit zu einer lösung ohne iframe.

gruß
steffen
lipsum ist offline   Mit Zitat antworten
Alt 16.05.2004, 12:52   #12
TP-Junior
 
Registriert seit: May 2004
gz09 macht alles soweit korrekt
so vielen dank für eure antworten..
bin zuversichtlich dass das nun so klappt wie ihr beschrieben habt, mach mich jetzt gleich mal dran das zu versuchen..

mfg
gz
gz09 ist offline   Mit Zitat antworten
Antwort

  Aktuelles Thema
  TP Hilfe Forum > Traum-Talk > Webdesign & Co.
html auf bild html auf bild
« Screendesign + Literaut + Kommunikation | einfacher html-Editor gesucht »

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 
Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Thema bewerten
Thema bewerten:

Forumregeln
Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an
Gehe zu

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Bestimmte Seiten laden nicht neffets Betriebssysteme 1 25.01.2004 08:04
Wie kann man mehrere Links auf ein Bild einfügen? CRAZYACHMED Dreamweaver 5 14.09.2003 15:00
Bild auf alt gemacht ? milos Photoshop 10 08.01.2003 20:00
Klick auf Bild...... kammschott GoLive 5 27.12.2002 15:10
Text auf transparentem Bild Stevano Druckstudio 6 06.12.2002 11:21


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:57 Uhr.

Powered by: vBulletin Version 3.7 (Deutsch)
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd. / Search Engine Friendly URLs by vBSEO 3.2.0 ©2008, Crawlability, Inc.
Traum-Projekt.com | Suchen | Archiv | Impressum | Kontakt | | | Nach oben |



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67