Nehadún-Testseiten-Test

  • Du kannst dir die Geschichte mit dem PNG auch sparen und mit Trick 17 ein annehmnbares halbtransparentes GIF hinbekommen, indem du eine 2x2 pixel große Datei aufmachst und oben links und unten rechts einen Pixel weiß färbst und den Rest transparent läßt.
    so kapierts dann auch IE. %-)


    Hier ist der Beweis, daß es klappt

  • Hm, das sieht aber dann so komisch gepunktet aus... ich lass es lieber so, wie es jetzt ist... nur interpretiert der IE das in der Text-Box immer noch nicht, da muss irgendwo noch ein Fehler sein. ???


    Viel größer ist im Moment noch das Problem der Anpassung des Layouts an verschiedene Bildschirmauflösungen...

  • Quote

    Original von Jerron
    Du kannst dir die Geschichte mit dem PNG auch sparen und mit Trick 17 ein annehmnbares halbtransparentes GIF hinbekommen, indem du eine 2x2 pixel große Datei aufmachst und oben links und unten rechts einen Pixel weiß färbst und den Rest transparent läßt.
    so kapierts dann auch IE. %-)


    Hier ist der Beweis, daß es klappt


    Die Lösung für Arme (IE-Benutzer) *gg*

  • Soooo *händereib* - hier könnt ihr euch mal die aktuelle Version angucken. :D


    Das Problem mit dem Bild ist nun gelöst, es wird bei weniger als 1600 Pixel Fensterbreite gestaucht und bei höheren gestreckt. Dafür muss ich nun in erster Linie Möglichkeiten suchen, Ladezeiten und Seitengröße zu verringern. Außerdem wird unten vom Bild noch was abgeschnitten.


    Das Ganze sieht mit Firefox 1.0.2, Opera 8 und IE 6 gleich aus, Netscape 7 macht die Textbox nicht transparent, aber das ist mir jetzt egal. :P An alle mit Linux, einem Mac oder exotischen Browsern - könntet ihr die Seite kurz testen und hier posten, ob irgendwas merkwürdig aussieht? Danke schonmal! :D

  • Schöön! :D
    Also, ich guck's mit Safari an. Stelle nur fest, dass oben, da wo das Menue sich an den oberen Streifen anschließt, das Bild irgendwie etwas verschoben ist.
    Ansonsten hab ich nur noch eine Frage: Warum hat die Textbox einen Scrollbalken? Das sieht erstens nicht so schön aus, und zweitens bewirkt es, dass der untere, schicke Teil des Bildes gar nicht zur Geltung kommt, weil man ja das ganze Fenster gar nicht scrollen muss...
    Ach ja: also mit Safari ist die Textbox auch transparent. Alles bestens! :)

    I'm one of many, I speak for the rest, but I don't understand... (Genesis - Man Of Our Times)

  • Quote

    Original von Latsi
    Ansonsten hab ich nur noch eine Frage: Warum hat die Textbox einen Scrollbalken? Das sieht erstens nicht so schön aus, und zweitens bewirkt es, dass der untere, schicke Teil des Bildes gar nicht zur Geltung kommt, weil man ja das ganze Fenster gar nicht scrollen muss...


    Das kommt daher, dass die Textbox mit overflow:auto versehen ist. Das bewirkt, dass Bild, Titelleiste und Navigationsleiste nicht mit dem Text mitscrollen, sonst würde man unten nämlich eine riesige weiße Fläche sehen, und das Bild würde nach oben wegscrollen. :( Ich habe tagelang zig andere Methoden ausprobiert, aber das ist die einzige, die funktioniert. Das Bild wird noch ein wenig beschnitten, damit es eher ein 16:9-Format ;) hat.

  • Sieht sehr schick aus, hast du fein gemacht! :thumbup:
    Das Problem ist nur, dass es zumindest bei mir sehr lange dauert, bis das mal nach unten scrollt und das stört beim Lesen irgendwie ziemlich. :-/

  • hm, im IE, Mozilla Firefox und Netscape sieht das bei mir soweit ok aus, obwohl da die Textbox wirklich etwas ruckelig scrollt. Mit Opera allerdings sieht das Hindergrundbild total pixelig aus und da ruckelt es auch enorm beim Scrollen der gesamten Seite. Die Textbox scrollt dementsprechend noch langsamer :-/
    Was mir auch noch aufgefallen ist: Wenn man das Browserfenster etwas zusammenschiebt und sich die BG-Grafik dadurch verkleinert, ist natürlich unten drunter alles weiß und die Textbox schiebt sich auch über bzw. unter das Menü.

  • Ganz unabhängig vom Einzelfall: wieso hast du dir eigentlich so eine Mühe mit dem Mond und dem ganzen Bild gemacht, wenn du ohnehin einen Großteil davon mit der halbtransparenten Fläche zudeckst? ;)


    Vielleicht kann man die Transparenz noch etwas erhöhen? Müsste man halt mal rumprobieren, ab wann die Lesbarkeit des Textes leidet.

  • Quote

    Außerdem wird unten vom Bild noch was abgeschnitten.


    liegt das nur an mir? bin ich wieder die einzige bei der gleich drei scrollbalken zu sehen sind?


    aaaals... nunja.. es ruckelt massiv.. undschoen.. und zwei screenshots fuer dir...


    screenshot nr 1


    screen 2

  • Ja, das mit dem Weiß am unteren Rand ist ein Problem, aber ich kann das Hintergrundbild nicht 100% hoch machen, weil es dann verzerrt werden würde. Das Weiß kann ich noch durch eine ähnliche Hintergrundfarbe ersetzen, aber der "auslaufende" Text sieht halt nicht gut aus.


    @ Tha Ira: Welche Bildschirmauflösung hast du denn? Das Bild ist in der Normalgröße 1600 Pixel breit, das sollte eigentlich erst dann pixelig aussehen, wenn man ein noch breiteres Browserfenster hat. Allerdings kann das auch von der Komprimierung des JPG kommen, ich weiß, dass das Bild dadurch enorm an Qualität einbüßt, aber es ist so schon groß genug... :-/


    @ Skyven: Jetzt, wo du's sagst, merke ich auch, dass ich mit Firefox unten einen horizontalen Scrollbalken habe, im IE auch, nur in Opera nicht. ???


    Ich hab jetzt mal testweise die Transparenz für alle Browser außer den IE rausgenommen (im IE funktioniert das Scrollen nämlich einwandfrei), auch wenn's jetzt doof aussieht. :'( Ist das besser so?
    Die Alternative wäre natürlich, die Texte auf mehrere Seiten zu verteilen, so dass man weniger scrollen muss, aber das würde bei höheren Auflösungen auch nicht gut aussehen, wenn so viel leerer Raum da ist...


    Ach ja, hier geht's zur transparenzlosen 08/15-Version. :( Ich kann mir außerdem nicht erklären, weshalb die Navigationsleistenbilder nicht nahtlos aneinanderliegen, bei einer alten HP-Version habe ich das genauso gemacht und es hat problemlos funktioniert.

  • und ich habe immernoch drei scrollende balken.
    und wenn du der gesamt seite das scrollen verbietest? du sagst ja eh bei der einen box dass sie auch so extra scrollen soll, aber du kannst es ja zusaetzlich im body abstellen
    (das wuerde zwar bedeuten dass wenn du nur innerhalb der divs scrollen laesst niemand sein mouserad benutzen kann aber ich finde du willst es sowieso viel zu vielen nutzern recht machen *fg*)

  • Quote

    Original von Gummishaif
    und ich habe immernoch drei scrollende balken.
    und wenn du der gesamt seite das scrollen verbietest? du sagst ja eh bei der einen box dass sie auch so extra scrollen soll, aber du kannst es ja zusaetzlich im body abstellen
    (das wuerde zwar bedeuten dass wenn du nur innerhalb der divs scrollen laesst niemand sein mouserad benutzen kann aber ich finde du willst es sowieso viel zu vielen nutzern recht machen *fg*)


    Ich habe die Scrollbalken mal testweise abgeschaltet - wer eine Maus mit Scrollrad hat, kann dann trotzdem scrollen. Ich wusste gar nicht, dass man innerhalb von <div>s das Mausrad generell nicht benutzen kann... woran liegt das? Kann man das irgendwie durch Trickserei umgehen? ;)


    Habt ihr eine Idee, wie ich verhindern kann, dass das Textfeld und die Navigationsleiste beim Verkleinern des Browserfensters ineinanderrutschen? Ich habe versucht, beide Kästen mittels z-index auf dieselbe Ebene zu setzen, aber davon lassen sich die Browser nicht beeindrucken. %-)

  • Bei mir (IE, WinXP, Auflösung keine Ahnung) ;D sieht es richtig gut aus, und gefällt. :nick: Ich find den Hintergrund übrigens sehr hübsch und passend, und die Farben passen imho auch, und quälen nicht die Augen. :thumbup:

  • Quote

    Habt ihr eine Idee, wie ich verhindern kann, dass das Textfeld und die Navigationsleiste beim Verkleinern des Browserfensters ineinanderrutschen? Ich habe versucht, beide Kästen mittels z-index auf dieselbe Ebene zu setzen, aber davon lassen sich die Browser nicht beeindrucken.


    hm, das kommt sicher durch deine prozentualen Angaben.
    Wieso gibts du eigentlich die Breite deines Menüs in Prozent an und nicht in Pixeln? Dann könntest du nämlich auch bei der Textbox - position: absolute in Pixeln angeben. Dann dürfte sich nix mehr ineinander verschieben

  • Ich dachte, das sähe prozentual bei sehr großen Auflösungen besser aus, weil dann auch das Textfeld nicht superbreit wird, aber die Nachteile überwiegen da wirklich. Ich hab's also wieder auf feste Größen umgestellt - so hatte ich es anfangs auch. %-)

  • Ja, ich habe das gleiche auch schon durch und fühle auch voll mit dir. Ich bastle nämlich bereits seit Wochen / Monaten am neuen Design meiner HP, weil ich diese gern auf CSS umstellen und sie auch für verschiedene Auflösungen brauchbar machen will. Aber die vielen Browser mit ihren unterschiedlichen Interpretationen bei CSS haben mich dabei auch schon mehrmals bis an den Rand der Verzweiflung gebracht und inzwischen bin ich auch von der variablen Breite wieder auf ne feste umgestiegen, weils einfach zu viele Probleme mit sich brachte. %-)

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!