Forum für CMS/made simple

rage_all

kennt CMS/ms

Ort: Augsburg

Registriert: 09. März 2011

Beiträge: 288

[GELÖST] Layer "Klickdurchlässig" machen

Hallo zusammen,

ich sitze und schwitze über einem Redesign meiner Seite, da die sowieso nicht mehr unter IE9 korrekt funktioniert und ... einfach alt ist. Was ich dabei gerne beibehalten wollte, war meine "Taschenlampe", die ich seinerzeit mit einer gigantischen Grafik die von Schwarz nach Transparent blendet, realisiert habe.

Heute haben wir CSS3, was den Quatsch mit der großen Grafik überflüssig macht - aber wie klicke ich sozusagen durch diesen Layer auf die darunterliegenden Links?
Hier mal ein Screen der Situation aktuell:
     

Im Prinzip dasselbe Phänomen trifft ja z.B. auf die Bildergalerie zu, wenn via JS eine Lightbox erzeugt wird; der darunterliegende Inhalt ist je nach Opazität zwar noch sicht- aber nicht mehr klickbar. Lässt sich das tricksen?

Ich spiele schon mit display, visibility etc. herum, fürchte aber dass — falls es überhaupt eine saubere Lösung gibt — nur eine Kombination von DIVs mit verschiedenen Eigenschaften zielführend ist... 

Danke für Eure Antworten!
Schöne Grüße

Michael

NaN

Moderator

Ort: Halle (Saale)

Registriert: 09. November 2010

Beiträge: 4.437

Re: [GELÖST] Layer "Klickdurchlässig" machen

ich würde versuchen, das Taschenlampending irgendwie zwischen Text und Texthintergrund zu bringen, anstelle es über allem drüber zu legen.
So z.B.

 Hier klicken, um den Code zum Kopieren zu markieren

<div id="content" style="background-color:#FFF">
	<div id="flashlight"></div>
	<article>
		Text ...
	</article>
</div>

---

Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)

rage_all

kennt CMS/ms

Ort: Augsburg

Registriert: 09. März 2011

Beiträge: 288

Re: [GELÖST] Layer "Klickdurchlässig" machen

Danke für Deinen Vorschlag.
Meine Intention war aber, dass die "Taschenlampe" unbedingt alle Ebenen "beleuchtet". Da sind am Schreibblock noch Schatten (die ich im nächsten Schritt versuche in eine andere Richtung zu lenken, je nachdem wo der Cursor x:y liegt), die einen Effekt erzeugen, der Hintergrund, usw.

Inzwischen habe ich eine Cross-Browser fähige Lösung gefunden; getestet mit Opera, Chrome, Firefox, Safari und InternetExplorer (wobei dieser den Kreisrunden Verlauf nicht unterstützt; aber wenigstens liegt nicht der unsichtbare Layer im Weg).

     

Im CSS bei der betroffenen Ebene muss der Schalter

 Hier klicken, um den Code zum Kopieren zu markieren

[== CSS ==]
pointer-events: none;

hinterlegt sein; dann ist diese Ebene "Klickdurchlässig", jedenfalls wie ich es verstanden habe.

So, dann planen wir mal noch 50% der Gesamtentwicklung für einen IE-Workaround (und ich dachte schon, diese Zeiten wären mit dem aussterben von IE6 endlich vorbei...) und widmen uns Schatten, die in entgegengesetzter Richtung der Maus verlaufen (wenn ich nach dem IE-Workaround noch Lust dazu habe...). 

Ich hatte eigentlich gehofft, mit einer puren CSS-Lösung die CPU-Last auf ein erklärbares Maß bringen zu können. Aber außer mit Firefox schnauft mein Rechner bei jedem anderen Browser. Blöd. 
Liegt das an der Berechnung der sichtbaren Flächen? Das JavaScript zur Bestimmung von x:y kann es ja kaum sein, da laufen anderswo erheblich krassere Scripts...

Trotzdem nochmal DANKESCHÖN!

--EDIT--
Opera unterstützt den Schalter leider nicht. Aus irgendeinem Grund wird zwar der Text markierbar, ein Link aber nicht klickbar.   

Beitrag geändert von rage_all (03. April 2012 11:19)

Klenkes

Server-Pate

Ort: 89428 Syrgenstein

Registriert: 17. Dezember 2010

Beiträge: 1.437

Re: [GELÖST] Layer "Klickdurchlässig" machen

...und ich dachte schon, diese Zeiten wären mit dem aussterben von IE6 endlich vorbei...

Nur mal so nebenbei...
Letzte Woche - Besuch bei neuem Kunden - 16 Arbeitsplätze - ALLE IE6!

Ich glaube ich sah ziemlich blöd aus, wie ich da so mit offenem Mund stauend da stand.
So sieht's beim regionalen industriellen Mittelstand aus!

Zu Ostern schenke ich der Chefin 16 Firefox Installationen. Das mach ich echt!

rage_all

kennt CMS/ms

Ort: Augsburg

Registriert: 09. März 2011

Beiträge: 288

Re: [GELÖST] Layer "Klickdurchlässig" machen

Ja, es gibt sie immer noch. Schlimm, sowas.
Auf einer Seite (die eigentlich von jüngerem Publikum besucht wird) habe aus den letzten 869 unique visitors noch immer 5 IE6... 
Die Serverparkweite Statistik meines Hosters erfasste im letzten Jahr noch 1,5%; seit 2012 werden sie aber nur noch unter "Sonstige" geführt...