Dario: Bildschirmüberlagerung

Hallo,
ich habe folgendes Problem. Ich möchte mir folgendes mit Javascript schaffen, ich denke anders ist es kaum realisierbar:
Sobald eine bestimmte Bedingung erfüllt ist wird der Homepageinhalt/Browser/Bildschirm verdunkelt, wie bei der lightbox, dann erscheint ein kleines Fenster, dass ich nach Möglichkeit per css in der Höhe und Breite Hintergrund etc definieren kann und gleichzeitig den Inhalt reinschreiben kann.

Bevor Fragen kommen, wozu das ganze dienen soll. Ich habe ein kleines Script erstellt, mit dem die Bildschirmgröße/auflösung ermittelt wird und die Homepage auf die Maße angepasst wird.
Bevor Leute kommen die es für random Sachen benutzen wollen, nein ich werde es nicht online stellen.

Ich bräuchte nur Hilfe bei dem oben genanntem Problem. Ich hab schon versucht die Lightbox ein wenig auseinanderzunehmen und dadurch vielleicht Ideen zu gewinnen, aber das ganze fand ich dann recht verwickelt miteinander.

Kann mir da jemand helfen?

Gruß Dario

  1. Hi,

    Ich habe ein kleines Script erstellt, mit dem die Bildschirmgröße/auflösung ermittelt wird

    wen interessiert die Bildschirmauflösung im Zusammenhang mit der Grösse des Browserfensters? Wenn Du sowas zum "Anpassen der Homepage" benutzt solltest Du Dein Konzept nochmal sehr gründlich überdenken. Die "Anpassen der Homepage" erfolgt durch ein kluges, flexibles Design.

    Gruesse, Joachim

    --
    Am Ende wird alles gut.
    1. Hi,

      Ich habe ein kleines Script erstellt, mit dem die Bildschirmgröße/auflösung ermittelt wird
      wen interessiert die Bildschirmauflösung im Zusammenhang mit der Grösse des Browserfensters? Wenn Du sowas zum "Anpassen der Homepage" benutzt solltest Du Dein Konzept nochmal sehr gründlich überdenken. Die "Anpassen der Homepage" erfolgt durch ein kluges, flexibles Design.

      Gruesse, Joachim

      Das Problem ist einfach die Differenz der verschiedenen Bildschirmgrößen bei unseren Usern. Insofern wollten wir bzw. ich beim neuen Design diesen Fehler nicht machen. Es wird je nach Bildschirmauflösung ein gewisses Design geladen. Dennoch fände iche Antwort auf meine ursprüngliche Frage besser ( ;-) ) ....

      Lg Dario

      1. Hi,

        Das Problem ist einfach die Differenz der verschiedenen Bildschirmgrößen bei unseren Usern.

        Nein, ist es nicht.
        Joachim hat dir doch gerade schon gesagt, dass die Masze des Browserfensters, genauer noch des Anzeigebereiches darin, entscheidend sind.

        Insofern wollten wir bzw. ich beim neuen Design diesen Fehler nicht machen. Es wird je nach Bildschirmauflösung ein gewisses Design geladen.

        *Damit* wuerdest du einen Fehler machen.

        Gestalte das Design so, dass es sich an unterschiedliche Viewportgroessen anpassen kann.

        Dennoch fände iche Antwort auf meine ursprüngliche Frage besser ( ;-) ) ....

        Auf eine auf unsinnigen Annahmen bzw. Vorhaben aufbauende Fragestellung kann es keine sinnvolle Antwort geben.

        MfG ChrisB

        --
        „This is the author's opinion, not necessarily that of Starbucks.“
        1. Hi,

          Das Problem ist einfach die Differenz der verschiedenen Bildschirmgrößen bei unseren Usern.

          Nein, ist es nicht.
          Joachim hat dir doch gerade schon gesagt, dass die Masze des Browserfensters, genauer noch des Anzeigebereiches darin, entscheidend sind.

          Insofern wollten wir bzw. ich beim neuen Design diesen Fehler nicht machen. Es wird je nach Bildschirmauflösung ein gewisses Design geladen.

          *Damit* wuerdest du einen Fehler machen.

          Gestalte das Design so, dass es sich an unterschiedliche Viewportgroessen anpassen kann.

          Dennoch fände iche Antwort auf meine ursprüngliche Frage besser ( ;-) ) ....

          Auf eine auf unsinnigen Annahmen bzw. Vorhaben aufbauende Fragestellung kann es keine sinnvolle Antwort geben.

          MfG ChrisB

          Inwiefern ist es unsinnig? Unser Designer hat meistens große Designs. Ein paar User haben extreme Schwierigkeiten damit. Das Script ist insofern hilfreich, dass das Design auf jede Bildschirmgröße angepasst wird und dann dem User ausgegeben wird.
          Es ist relativ sinnvoll.

          Wie auch immer, ich verstehe nicht warum ihr mir nicht helfen wollt. Das gleiche wollte ich eventuell öfters bei anderen Dingen verwenden, wäre ganz praktisch.

          Hoffe auf Hilfe,
          Dario

          1. Hi,

            Inwiefern ist es unsinnig? Unser Designer hat meistens große Designs.

            Das ist schön, denn ich habe auch einen grossen Monitor. Genau deshalb ist mein Browser jedoch nie auf Vollbild eingestellt. Schade, wenn Du mir nun ein Layout lieferst, dass von einer falschen Grösse ausgeht, weil Du die Bildschirmauflösung ermittelt hast.

            Es ist relativ sinnvoll.

            Sinnvoll ist es ein möglichst flexibles Design, bspw. in % oder em Werten, oder einen Wert, der sich an der "Lesebreite" (Breite, bei der sich ein Text noch gut lesen lässt, imho ca 600px-700px) plus Navigation orientiert. Alles weitere kann sich der Nutzer selber einstellen, denn jeder Browser ist in der Lage, die Anzeige zu skalieren, inzwischen geht das sogar mit Hintergrundbildern. Ist mir also die Schrift zu klein, stelle ich im FF mit Strg+ die Anzeige grösser. Einfach, selbstbestimmt und ohne überflüssige Hacks!

            Wie auch immer, ich verstehe nicht warum ihr mir nicht helfen wollt.

            Das möchten wir sehr wohl. Aber zugleich möchten wir Dich vor fehlgeleiteten Konzepten bewahren, die Dir einen hohen und überflüssigen Pflegeaufwand bescheren. Euer Designer ist offenbar noch nicht im Internet angekommen, sonden veranstaltet weiterhin Printdesign. Aber DIN A4 gibt es nun mal nicht im www.

            Ansonsten: ist ist wirklich nicht klar was Du nun eigentlich willst. Einerseits ermittelst Du Höhe und Breite, dann soll der Nutzer aber Werte für Hintergrund etc. eingeben... das klingt eher sehr konfus und keinesfalls benutzerfreundlich.

            Gruesse, Joachim

            --
            Am Ende wird alles gut.
            1. Hallo,
              ich habe folgendes Problem. Ich möchte mir folgendes mit Javascript schaffen, ich denke anders ist es kaum realisierbar:
              Sobald eine bestimmte Bedingung erfüllt ist wird der Homepageinhalt/Browser/Bildschirm verdunkelt, wie bei der lightbox, dann erscheint ein kleines Fenster, dass ich nach Möglichkeit per css in der Höhe und Breite Hintergrund etc definieren kann und gleichzeitig den Inhalt reinschreiben kann.

              »»

              Kann mir da jemand helfen?

              »»

              Gruß Dario

              Das war meine Frage. Das könnte ich in diversen Projekten erneut verwenden. Was aber das Problem bei unseren Usern ist, nicht alle haben unbedingt die Ahnung sich etwas mit dem Browser selber zu skalieren. Wir möchten ein gutes Design liefern und es so benutzerfreundlich wie möglich machen. Es soll so gut wie alles automatisiert werden, wir möchten nicht, dass User lange daran sitzen etwas einzustellen.
              Zum anderen sieht es dann auch nicht so toll aus wenn ein User auf unsere Seite stößt und diese dann verzerrt ist, weil sein Browser nicht richtig eingestellt ist. Da kann man doch lieber auf solche Scripts zurückgreifen, die eine optimale Grafik ermöglichen. Unser Designer ist schon im www angekommen, wir denken nur einfach, speziell er denkt nachdem er das hier alles gelesen hat, dass es wirklich "Schwachsinn" ist es den Usern selber zu überlasten. Ich meine 80% der User, die bei uns aktiv sind, werden wohl kaum ihren Browser einstellen können.

              Mir geht es noch einmal um dieses Lightbox Schema. Ich habe nur gesagt wozu das ganze dienen soll. Sollte ich wissen wie es funktioniert, werde ich das ganze mit Sicherheit in anderen Projekten wiederverwerten.

              Dario

              ... Tut mir leid oben habe ich mit dem Beitrag völligen Mist gebaut. Wie auch immer.

              1. Das war meine Frage. Das könnte ich in diversen Projekten erneut verwenden. Was aber das Problem bei unseren Usern ist, nicht alle haben unbedingt die Ahnung sich etwas mit dem Browser selber zu skalieren. Wir möchten ein gutes Design liefern und es so benutzerfreundlich wie möglich machen. Es soll so gut wie alles automatisiert werden, wir möchten nicht, dass User lange daran sitzen etwas einzustellen.

                Eben, deshalb ist es sinnvoll relativen Größen zu benutzen, dann macht der Browser die ganze "Arbeit" von allein.

                Deine Idee ist es doch gerade, dass der User irgendwas einstellen soll, aber warum, wenn das auch ohne geht oder hast du schon mal eine Seite gesehen, wo der Besucher irgendwelche Größenanagaben einstellt?

                Zum anderen sieht es dann auch nicht so toll aus wenn ein User auf unsere Seite stößt und diese dann verzerrt ist, weil sein Browser nicht richtig eingestellt ist. Da kann man doch lieber auf solche Scripts zurückgreifen, die eine optimale Grafik ermöglichen.

                Wenn die Seite verzerrt ist, dann liegt das eher an ungünstigen CSS Angaben, aber sicher nicht daran, dass der Browser nicht richtig eingestellt ist.

                Unser Designer ist schon im www angekommen, wir denken nur einfach, speziell er denkt nachdem er das hier alles gelesen hat, dass es wirklich "Schwachsinn" ist es den Usern selber zu überlasten.

                Es geht nicht darum dem User es selber zu überlassen, sondern darum dem Browser es selber zu überlassen, bzw. damit zu arbeiten, dass es eben keine einheitliche Umgebung für HTML Seiten im Internet gibt und an diese gegebenheiten das HTML/CSS anzupassen. Das ist "im www ankommen", denn genau  für diesen Zweck wurde HTML entwickelt, als Darstellungsformat das sich an die Möglichkeiten anpaßt.

                Mir geht es noch einmal um dieses Lightbox Schema. Ich habe nur gesagt wozu das ganze dienen soll. Sollte ich wissen wie es funktioniert, werde ich das ganze mit Sicherheit in anderen Projekten wiederverwerten.

                Es ist nicht ganz klar was du eigentlich konkret Wissen willst. Wie du die Größe des Viewport ermittelst? Wie du ein Element erzeugst? Wie du ein Element transparent machst?

                Struppi.

                1. Hallo,
                  ich möchte diese Lightbox-Überlagerung miteinbringen. Das heißt der Bildschirm wird mit einer gewissen Transparenz völlig Schwarz gefärbt. Gleichzeitig erscheint ein Fenster wie bei der Lightbox, nur ohne Bilder oder so etwas. Dieses Fenster würde ich gerne per CSS dann definieren dort wird dannein Inhalt ausgegeben. Beenden kann man diesen Prozess nur indem man auf OK im Fenster gedrückt hat, später baue ich noch einen Timer ein.

                  Wie auch immer vielleicht hat es den anschein erweckt, dass User selbst etwas einstellen müssen, dem ist absolut nicht so!
                  Es wird automatisch eine Bildschirmgröße ermittelt und dadurch wird das Design angepasst. Wir wollen ja gerade verhindern, dass User großartig was verstellen.
                  Für uns ist es vll. etwas Arbeit aber für die User ist es doch extrem freundlicher.

                  1. Hi,

                    Wie auch immer vielleicht hat es den anschein erweckt, dass User selbst etwas einstellen müssen, dem ist absolut nicht so!

                    nein, das habe ich auch weder aus Struppis, noch aus Joachims, noch aus deinen Beiträgen gelesen. Aber du berücksichtigst nicht einmal, dass der Besucher selbst etwas einstellen *könnte*.

                    Es wird automatisch eine Bildschirmgröße ermittelt und dadurch wird das Design angepasst.

                    Und das ist Unsinn, das versuchen wir dir doch die ganze Zeit zu erklären. Die Bildschirmgröße hat NICHTS mit der verfügbaren Größe des Browserfensters zu tun!

                    * Sidebars, Toolbars, Menüleisten usw. brauchen Platz
                     * Viele Anwender betreiben ihr Browserfenster nicht im Vollbildmodus

                    Du gehst aber davon aus, dass deine Besucher ihr Browserfenster maximiert haben (an sich schon ein Sonderfall), und außerdem auch die ganze Bildschirmfläche überhaupt dem Browser zur Verfügung steht. Das ist nur in Ausnahmefällen so!

                    Für uns ist es vll. etwas Arbeit aber für die User ist es doch extrem freundlicher.

                    Für euch ist es etwas Arbeit, das Layout so zu gestalten, dass es sich automatisch der Fenstergröße, zumindest der Breite, anpasst. Dafür gibt es in CSS relative Maßeinheiten oder die Möglichkeit, Größenangaben gar nicht zu definieren (dann gelten meistens sinnvolle Defaultwerte).

                    So long,
                     Martin

                    --
                    Success should be measured not so much by the position that one has reached in life,
                    but by the obstacles one has overcome while trying to succeed.
                    1. Was wäre dann also wenn ich nur die Breite definiere? Dann würde es doch eigentlich Sinn ergeben?!

                      Zurück zu meiner Frage, ich brauch da echt eine Antwort, da ich das später dann auch mal verwenden möchte. Kann man dir ja jetzt jemand helfen?

                      Dario

                      1. lieber Dario,

                        Zurück zu meiner Frage, ich brauch da echt eine Antwort, da ich das später dann auch mal verwenden möchte. Kann man dir ja jetzt jemand helfen?

                        ich glaube Du solltest wirklich nochmal klar ausdrücken, was genau Du willst.

                        Falls es ein Lightboxeffekt mit Eingabe-Möglichkeiten ist: schau Dir jquery an und füge die Erweiterung thickbox hinzu. Nun kannst Du jedes beliebige Element (iframe, image, div) im Lightboxlook anzeigen.

                        Btw: Die Ermittlung der nötige Grösse für das Overlay macht das Framework alleine...

                        Gruesse, Joachim

                        --
                        Am Ende wird alles gut.
              2. Das war meine Frage. Das könnte ich in diversen Projekten erneut verwenden. Was aber das Problem bei unseren Usern ist, nicht alle haben unbedingt die Ahnung sich etwas mit dem Browser selber zu skalieren. Wir möchten ein gutes Design liefern und es so benutzerfreundlich wie möglich machen. Es soll so gut wie alles automatisiert werden, wir möchten nicht, dass User lange daran sitzen etwas einzustellen.

                Der Ansatz, ein "flüssiges" Layout anzubieten, entspricht doch gerade der Ahnungslosigkeit der Benutzer! Ohne ihr Zutun ist das Layout genau so, dass es ihrer Viewportgröße (Viewport ist der Teil im Browser, wo eine Webseite dargestellt wird) entsprechend angezeigt wird.

                Zum anderen sieht es dann auch nicht so toll aus wenn ein User auf unsere Seite stößt und diese dann verzerrt ist, weil sein Browser nicht richtig eingestellt ist.

                Wieso "verzerrt"? Man muss es eben richtig machen.

                Da kann man doch lieber auf solche Scripts zurückgreifen, die eine optimale Grafik ermöglichen.

                Es könnte jedoch sein, dass Skripte nicht ausgeführt werden. Weil der Client gar keine Skripte kennt, weil sie gefiltert oder deaktiviert werden, es gibt viele Möglichkeiten.

                Unser Designer ist schon im www angekommen, wir denken nur einfach, speziell er denkt nachdem er das hier alles gelesen hat, dass es wirklich "Schwachsinn" ist es den Usern selber zu überlasten. Ich meine 80% der User, die bei uns aktiv sind, werden wohl kaum ihren Browser einstellen können.

                --
                Reden ist Silber, Schweigen ist Gold, meine Ausführungen sind Platin.
                Self-Code: sh:( ch:? rl:( br:> n4:( ie:{ mo:) va:) de:> zu:} fl:| ss:| ls:~ js:|
  2. Hallo,
    ich habe folgendes Problem. Ich möchte mir folgendes mit Javascript schaffen, ich denke anders ist es kaum realisierbar:
    Sobald eine bestimmte Bedingung erfüllt ist wird der Homepageinhalt/Browser/Bildschirm verdunkelt, wie bei der lightbox, dann erscheint ein kleines Fenster, dass ich nach Möglichkeit per css in der Höhe und Breite Hintergrund etc definieren kann und gleichzeitig den Inhalt reinschreiben kann.

    Kann mir da jemand helfen?

    Gruß Dario

    Das war meine Frage. Das könnte ich in diversen Projekten erneut verwenden. Was aber das Problem bei unseren Usern ist, nicht alle haben unbedingt die Ahnung sich etwas mit dem Browser selber zu skalieren. Wir möchten ein gutes Design liefern und es so benutzerfreundlich wie möglich machen. Es soll so gut wie alles automatisiert werden, wir möchten nicht, dass User lange daran sitzen etwas einzustellen.
    Zum anderen sieht es dann auch nicht so toll aus wenn ein User auf unsere Seite stößt und diese dann verzerrt ist, weil sein Browser nicht richtig eingestellt ist. Da kann man doch lieber auf solche Scripts zurückgreifen, die eine optimale Grafik ermöglichen. Unser Designer ist schon im www angekommen, wir denken nur einfach, speziell er denkt nachdem er das hier alles gelesen hat, dass es wirklich "Schwachsinn" ist es den Usern selber zu überlasten. Ich meine 80% der User, die bei uns aktiv sind, werden wohl kaum ihren Browser einstellen können.

    Mir geht es noch einmal um dieses Lightbox Schema. Ich habe nur gesagt wozu das ganze dienen soll. Sollte ich wissen wie es funktioniert, werde ich das ganze mit Sicherheit in anderen Projekten wiederverwerten.

    Dario

  3. Tach.

    Sobald eine bestimmte Bedingung erfüllt ist wird der Homepageinhalt/Browser/Bildschirm verdunkelt, wie bei der lightbox, dann erscheint ein kleines Fenster, dass ich nach Möglichkeit per css in der Höhe und Breite Hintergrund etc definieren kann und gleichzeitig den Inhalt reinschreiben kann.

    Was genau möchtest Du jetzt wissen? Wie man den "Bildschirm verdunkelt"?

    Wenn ich mich recht erinnere, fügt Lightbox vor allen Inhalten im BODY ein absolut positioniertes DIV ein, breitet dieses auf die gesamte Höhe und Breite des Viewports aus und macht es halbtransparent (entweder mit CSS' opacity oder einem alphatransparenten PNG als Hintergrundbild). Inhalte, die nicht mit verdunkelt werden sollen, liegen dann in der Hierarchie noch über diesem DIV.

    --
    Wenn es schwingt, ist es ein Filter – Oszillatoren würden so etwas nie tun.