nicht angemeldet
transparentes Bild überblenden, aber Seite normal klickbar
Hallo,
ich will über eine normale Seite ein halbtransparentes Bild legen, aber die Webseite sollte noch normal benutzbar (Links usw.) sein.
...
<body>
<div style="position:absolute; z-index:1; filter:alpha(opacity=25); -moz-opacity: 0.25;">
<img alt="heidi" src="heidi.jpg">
</div>
...
Jetzt wird über dem eigenlichen Kontent halt das Bild durchscheinend angezeigt und nix ist mehr klickbar. Jetzt dachte ich mir, alle Maus-Events mit "return false;" abwenden, damit es im DOM zum nächsten Element geht, aber das wird wohl body sein.
Irgendeine Idee, wie ich dahin komme?
-
Hallo,
...
<body>
<div style="position:absolute; z-index:1; filter:alpha(opacity=25); -moz-opacity: 0.25;">Guter Ansatz, aber du solltest das ohne Bild machen und z.B. direkt für body.
Oder für ein Container-Element, dass den Seiteninhalt enthält (aber nicht für ein Ele,ent, dass du über alle anderen Inhalte legst, denn das kann ja nicht funktionieren, denn das Element/Bild liegt ja über alles, was sich "darunter" befindet.Was genau möchtest du machen?
Grüße
Thomas-
»»denn das kann ja nicht funktionieren, denn das Element/Bild liegt ja
»»über alles, was sich "darunter" befindet.Was genau möchtest du machen?
»»
Ja, das Bild liegt über dem Kontent, das ist ja die Nuss, die es zu knacken giltt. Ich will durch dieses übergeblendete Bild z.B. den sichtbaren Bereich bei 800x600-Auflösung (dynamisch anpassbar) visualisieren. Es soll eine Hilfe für die Designer sein, aber man soll die Seiten weiterhin durchklicken können. Das Bild/Layer wird auf allen Seiten im Design-Testmodus eingeblendet.
Ich suche nach einer Idee, wie ich die Mausevents (klick, mouseover usw.) auf die Elemente hinter dem übergelendeten Bild weitergeben kann.
Gruss, Christian.
-
Hi there,
Ich suche nach einer Idee, wie ich die Mausevents (klick, mouseover usw.) auf die Elemente hinter dem übergelendeten Bild weitergeben kann.
Hängt davon ab, wie Du die Elemente im Hintergrund plazierst. Wenn Du dort auch mit absoluter Positionierung arbeitest, dann kannst Du ja, da Du auch die Maße Deiner Hintergrundelement kennst, auf der darübergelegten Graphik ein Imagemap definieren.
FÜr die Darstellung aber macht es eigentlich keinen Untgerschied, was denn jetzt wirklich im VOrdergrund ist. Ich denke, Du kannst den selben oder zumindest einen sehr ähnlichen Effekt erzielen, wenn Du die "Hintergrund"-Elemente in einen mit <div> definierten Bereich packst und diesen semitransparent setzt...
-
Hängt davon ab, wie Du die Elemente im Hintergrund plazierst. Wenn Du dort auch mit absoluter Positionierung arbeitest, dann kannst Du ja, da Du auch die Maße Deiner Hintergrundelement kennst, auf der darübergelegten Graphik ein Imagemap definieren.
Nein, das ist keine Option. Die Seiten sind ja nicht in meiner Verantwortung.
FÜr die Darstellung aber macht es eigentlich keinen Untgerschied, was denn jetzt wirklich im VOrdergrund ist. Ich denke, Du kannst den selben oder zumindest einen sehr ähnlichen Effekt erzielen, wenn Du die "Hintergrund"-Elemente in einen mit <div> definierten Bereich packst und diesen semitransparent setzt...
Wenn mein Bild im Hintergrund liegt, verdecken die Bilder der Webseite trotz "body style='transparent'" das Bild. Ok, dann könnte ich diese ja transparent machen:
document.onload = function () {
{ liste = document.getElementsByTagName("img");
for (i=0;i<liste.length;i++)
{ liste[i].style="filter:alpha(opacity=75); -moz-opacity: 0.75;"; }
}Das tut aber auch nicht so recht, ist aber eine Option!
-
Hi there,
Nein, das ist keine Option. Die Seiten sind ja nicht in meiner Verantwortung.
ja sorry, hab wohl den Originalpost nicht wirklich aufmerksam gelesen;)
document.onload = function () {
{ liste = document.getElementsByTagName("img");
for (i=0;i<liste.length;i++)
{ liste[i].style="filter:alpha(opacity=75); -moz-opacity: 0.75;"; }
}Das tut aber auch nicht so recht, ist aber eine Option!
Wenn Du alle Elemente und nicht nur die Bilder erfassen willst gehts auch wesentlich einfacher mit einem semitransparenten Bereich.
I.Ü. wüßte ich nicht, wie Du verdeckte Elemente sonst erreichen kannst, da es ja gerade deren Eigenschaft ist, verdeckt zu sein; es sozugsagen nur einen z-index gibt und nicht einen z-index für den Betrachter und einen für die Maus...-
Wenn Du alle Elemente und nicht nur die Bilder erfassen willst gehts auch wesentlich einfacher mit einem semitransparenten Bereich.
Die Transparenz im body-Tag war nicht ausreichend, deswegen obige Schleife.
I.Ü. wüßte ich nicht, wie Du verdeckte Elemente sonst erreichen kannst, da es ja gerade deren Eigenschaft ist, verdeckt zu sein; es sozugsagen nur einen z-index gibt und nicht einen z-index für den Betrachter und einen für die Maus...
Stimmt, das ist die Herrausforderung. Interessanterweise hat mir da ein Bild die Änderung mit "This attribute is only a setter, not a getter" abgelehnt.
Daber danke, die Ideen hier haben mich schon weitergebracht.
-
Stimmt, das ist die Herrausforderung. Interessanterweise hat mir da ein Bild die Änderung mit "This attribute is only a setter, not a getter" abgelehnt.
Noch einfacher in head: <style ..> img, td, table { filter ... } </style>
Und schon sind alle Bilder durchscheinend und ich kann meine Grafik in den Hintergrund bringen und trotzdem alle Links anklicken.
Danke allen hier!
-
-
-
-
-
Hallo,
Ja, das Bild liegt über dem Kontent, das ist ja die Nuss, die es zu knacken giltt. (...]
Ich suche nach einer Idee, wie ich die Mausevents (klick, mouseover usw.) auf die Elemente hinter dem übergelendeten Bild weitergeben kann.Viel Spaß.
Gut, im Ernst, ich halte das nicht für möglich. (Außer du positioniert _jedes_ Element in der Seite und dann/oder vergleichts den abgdeckten Bereich der Elemente mit der Mausposition und versucht dann darauf zu reagieren.
Aber, ich glaube kein "Designer-Mode" kann den dazugehörige Aufwand rechtfertigen.Grüße
Thomas-
Außer du positioniert _jedes_ Element in der Seite und dann/oder vergleichts den abgdeckten Bereich der Elemente mit der Mausposition und versucht dann darauf zu reagieren.
Aber, ich glaube kein "Designer-Mode" kann den dazugehörige Aufwand rechtfertigen.Hmmm, ich kann ja in einer Schleife den DOM durchrennen und das passende Element suchen - das wär einfach und unabhängig von Design/Kontent.
Aber die zweite Option, den ganzen Kontent durchscheinend zu machen und mein Bild dahinter zu legen, scheint mir insgesamt einfacher. Mal sehen, wie des aussieht ...
Danke und gute Nacht, Christian.
-
-
hi,
Ich will durch dieses übergeblendete Bild z.B. den sichtbaren Bereich bei 800x600-Auflösung (dynamisch anpassbar) visualisieren.
Nein, die "Auflösung" hat immer noch nichts damit zu tun, wie groß das Browserfenster ist, und wie viel Platz darin zur Anzeige von HTML-Dokumenten zur Verfügung steht.
Es soll eine Hilfe für die Designer sein
Halte ich für einen untauglichen Ansatz.
Wie es damit in kleineren Browserfenstern aussieht, kannst du damit nur ziemlich realitätsfern simulieren. Z.B. wird ein Browser keine Umbrüche machen oder Scrolballken anzeigen, wenn überbreite Inhalte über den Bereich deines "Größenvisualisierungsbildes" hinausgehen.
Das Ergebnis eines solchen "Tests" hätte also mit der Realität nur ganz am Rande etwas gemein.Warum nicht einfach das Fenster wirklich auf eine entsprechende Größe bringen?
window.resizeTo() existiert, und liesse sich bspw. auch gut in Bookmarklets unterbringen.
Extensions wie bspw. die Web Developer Extension für den FF bieten darüberhinaus weitere simple Möglichkeiten, dass Fenster auf Knopfdruck aufbestimmte gängige Größen zu bringen.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Nein, die "Auflösung" hat immer noch nichts damit zu tun, wie groß das Browserfenster ist, und wie viel Platz darin zur Anzeige von HTML-Dokumenten zur Verfügung steht.
- Es war nur ein Beispiel und hatte nicht mit der Sinnhaftigkeit zu tun.
- Leider gibt es viel zu viele Seiten mit ziemlich starren Design. Das ist nun mal so und daran kann ich nichts ändern.
Das Ergebnis eines solchen "Tests" hätte also mit der Realität nur ganz am Rande etwas gemein.
Das lass meine Sorge sein, ich hatte ja eine technische und keine religöse Frage gestellt.
Danke den anderen technisch Interessierten.
-
-
-