nicht angemeldet
Mousover-Effekt als Inline CSS ohne JavaScript
0 
Matthias Apsel
0 
Gunnar Bittersmann
0 0 Tabellenkalk
0 0 0 Fred
0 0 0 0 Matthias Apsel
Mousover-Effekt als Inline CSS ohne JavaScript
MudGuard
JürgenBHallo,
ich soll für meinen Teamleiter mehrere Grafiken mit einem Mousover-Effekt versehen (Bild vergrößert sich um xx%), leider sorgt unser Intranet für einige Barrieren, so dass ich auch nach langer Recherche keine Lösung gefunden habe.
Ausgangslage:
- keine JavaScript Einbindung im Intranet möglich
- CSS lässt sich nur inline einfügen (alle anderen style angaben werden beim speichern der Seite entfernt)
- Wir arbeiten bei Grafiken nicht mit festen Pixelangaben sondern mit Prozent um die Seiten ein Stück weit responsiv zu gestalten.
Kurz um ich brauche einen Mousover-Effekt als Inline CSS ohne JavaScript.
Es wäre super wenn jemand mir helfen könnte, da ich leider bis jetzt keine funktionierende Lösung finden konnte.
-
Hallo Niesse,
Kurz um ich brauche einen Mousover-Effekt als Inline CSS ohne JavaScript.
Per CSS steht dir die Pseudoklasse
:hoverzur Verfügung, diese lässt sich aber nicht inline gestalten. Damit ist diese Aufgabe mMn. nicht lösbar.Bis demnächst
Matthias-
@@Matthias Apsel
Per CSS steht dir die Pseudoklasse
:hoverzur VerfügungUnd die Pseudoklasse
:focus(wichtig für Tastaturbedienung). Wo:hoverist, sollte:focusnicht weit sein.diese lässt sich aber nicht inline gestalten.
Dadurch allerdings rückt eine Lösung in weite Ferne.
LLAP 🖖
--
“There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns”
Selfcode:sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
-
-
@@Niesse
- CSS lässt sich nur inline einfügen (alle anderen style angaben werden beim speichern der Seite entfernt)
-
Wieso das denn?
-
Was heißt „nur inline einfügen“? Nur
style-Attribute oder auchstyle-Elemente?
LLAP 🖖
--
“There’s no such thing as an ‘average’ user, but there is such a thing as an average developer.” —Vitaly Friedman in Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns”
Selfcode:sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|-
- CSS lässt sich nur inline einfügen (alle anderen style angaben werden beim speichern der Seite entfernt)
-
Wieso das denn?
-
Was heißt „nur inline einfügen“? Nur
style-Attribute oder auchstyle-Elemente?
zu 1. Die Frage kann ich leider nicht beantworten, warum alles geblockt ist.
zu 2. Das System löscht beim speichern alle <style> Tags aus dem HTML Code. Daher kann ich wirklich nur inline die style Angaben festlegen.
-
Hallo,
Das System
um welches handelt es sich denn? Ich vermute, du arbeitest hier in einem CMS und hast nur Benutzerrechte um Artikel anzulegen. Du musst einen Admin für das System finden, der die gewünschte Änderung ins Stylesheet eintragen darf.
Gruß
Kalk-
Hallo,
Das System
um welches handelt es sich denn? Ich vermute, du arbeitest hier in einem CMS und hast nur Benutzerrechte um Artikel anzulegen. Du musst einen Admin für das System finden, der die gewünschte Änderung ins Stylesheet eintragen darf.
Gruß
KalkWir arbeiten mit IBM Connections. Ich habe in dem entsprechenden Wiki, in welchem die Bilder eingebunden sind, Adminrechte. Die Eintragung von Stylesheets ist grundsätzlich nicht möglich.
Gruß Niesse
-
Hallo,
IBM Connections.
Kenne ich nicht.
Die Eintragung von Stylesheets ist grundsätzlich nicht möglich.
Das wundert mich zwar, aber dann muss dein Teamleiter wohl auf das Feature verzichten.
Gruß
Kalk-
Mahlzeit,
Das wundert mich zwar, aber dann muss dein Teamleiter wohl auf das Feature verzichten.
naja, wenn es nur für den Chef ist...
Sollte er den Firefox nutzen, könnte man ja in seinem FF Profil im Unterverzechnis chrome in der userContent.css was ausrichten.Fred
--
" " (Douglas Fairbanks Senior)
-
-
-
-
Hallo,
ich soll für meinen Teamleiter mehrere Grafiken mit einem Mousover-Effekt versehen (Bild vergrößert sich um xx%), leider sorgt unser Intranet für einige Barrieren, so dass ich auch nach langer Recherche keine Lösung gefunden habe.
nach langer Recherche sollte man erkannt haben, dass vergrößern im Englischen "scale" heißen kann. Und damit wiederum kann man im Wiki fündig werden.
@Matthias Apsel: auf der verlinkten Seite soll man in den Beispielen die Maus in umrandete Bereiche bewegen. Die Umrandung sehe ich nicht.
Gruß
Kalk-
Hallo Tabellenkalk,
@Matthias Apsel: auf der verlinkten Seite soll man in den Beispielen die Maus in umrandete Bereiche bewegen. Die Umrandung sehe ich nicht.
Ich schon ;-) Der äußerste Pixel der weißen Fläche ist der Rand ;-) Ich ändere das. Wäre „weiße Flächen“ in Ordnung?
Bis demnächst
Matthias-
Hallo,
Ich schon ;-) Der äußerste Pixel der weißen Fläche ist der Rand ;-) Ich ändere das. Wäre „weiße Flächen“ in Ordnung?
ich weiß nicht, was du da siehst. Bei mir sind es weiße Flächen auf weißem Hintergrund. Welches ist bei dir der äußerste Pixel?
Gruß
Kalk-
Hallo Tabellenkalk,
ich weiß nicht, was du da siehst. Bei mir sind es weiße Flächen auf weißem Hintergrund. Welches ist bei dir der äußerste Pixel?
Ah. Spannend. Frickl vs. Link in neuem Tab öffnen.
Bis demnächst
Matthias-
Hallo,
Ah.
komisch, jetzt auf einmal sind Rahmen da :)
Spannend. Frickl vs. Link in neuem Tab öffnen.
ok, die Beispiele in neuem Tab zu öffnen hatte ich bisher nicht probiert. Wo kommt da auf einmal eine Hintergrunzfarbe her?
Gruß
Kalk-
Hallo Tabellenkalk,
ok, die Beispiele in neuem Tab zu öffnen hatte ich bisher nicht probiert. Wo kommt da auf einmal eine Hintergrunzfarbe her?
Die Beispiele haben ein allgemeines und ein beispielspezifisches CSS. Ersteres als externes Stylesheet eingebunden, letzteres per style-Element. Für das frickl wird nur letzteres verwendet.
Bis demnächst
Matthias
-
-
-
-
-
-
Hallo
Werden denn auch style-Elemente im body-Bereich gelöscht?
Eventuell läßt sich das style-Tag auch so maskieren, dass es beim Löschvorgang nicht erkannt aber trotzdem ausgeführt wird. Nur als Denkanstoß, da bin ich kein Experte.
Da ich das System weder kenne noch gar zur Verfügung habe kann ich das selbst leider nicht ausprobieren.
Grundsätzlich müssen sich ja externe Dateien einbinden lassen, sonst würden die Bilder nicht angezeigt werden. Läßt sich eventuell eine externe CSS-Datei im body-Bereich einbinden?
Gruss
MrMurphy
-
Grundsätzlich müssen sich ja externe Dateien einbinden lassen, sonst würden die Bilder nicht angezeigt werden.
Nöö, wenn ich so ein Perversling wäre wie das vorhandene System, würde ich die Bilder in HTML einbinden.
Oh ja, dann würde ich mir teuflische Dinge ausdenken (schwärm) ...
Da mache ich jeden Browser zum Editor, warum sollten Überschriften abgehoben sein. Und Farbe? Hatte man früher auf dem Fax auch nicht. Auch Umlaute und Kleinbuchstaben gab es nicht in der EDV-Gründerzeit (erinner).
Aber auch keine Viren (toll).
Und wenn wir noch etwas warten, gibt es die Gummibildschirme, da kann mann seine Graphiken groß ziehen. Eine echte Herausforderung für System-Entwickler, auch das zu verhindern.
Linuchs
-
Hi,
Da mache ich jeden Browser zum Editor, warum sollten Überschriften abgehoben sein. Und Farbe? Hatte man früher auf dem Fax auch nicht. Auch Umlaute und Kleinbuchstaben gab es nicht in der EDV-Gründerzeit (erinner).
Aber auch keine Viren (toll).
Dafür gab's abgerissene Lochstreifen, durchgemischte Lochkarten, Bandsalat (die pizzatellergroßen Spulen mit den 16mm(?) Bändern) ... ;-)
cu,
Andreas a/k/a MudGuard-
Hallo Andreas,
… Bandsalat (die pizzatellergroßen Spulen mit den 16mm(?) Bändern) ... ;-)
und abgelöste Inventarisierungsaufkleber vor der Lichtschranke des Bandendedetektors …
Gruß
Jürgen -
... durchgemischte Lochkarten, ...
Aber wir Programmierer waren noch was. Herrscher der 12.000 x 7 sichtbaren Speicherkerne in der kleiderschrankgroßen Zentraleinheit.
Und Chancen bei den Locherinnen:
"Das Schönste ist auf Erden, lochen und gelocht zu werden."
Die heutigen Mädels gähnen doch nur müde, wenn ich mit meinen Kenntnissen in CSS und Javascript prahle.
Linuchs
-
-
-
-
Ich hab die Lösung:
Dein Chef möge sich ein Tablet zulegen. Da kann er jede beliebige Grafik mit zwei Fingern spreizen und vergrößern.
Ganz ohne Javascript und CSS.
Linuchs
-
Hallo Linuchs,
Dein Chef möge sich ein Tablet zulegen. Da kann er jede beliebige Grafik mit zwei Fingern spreizen und vergrößern.
<meta name="viewport" content="width=device-width, initial-scale=0.01, user-scalable=no">:-p
Bis demnächst
Matthias-
Hallo Matthias,
danke für die Munition
initial-scale=0.01, user-scalable=nofür mein teuflisches Magazin, muss ich gelegentlich mal ausprobieren.Die Zeiten sind doch noch nicht vorbei, dass die User auf Knien angerutscht kommen und um Gnade winseln (freu).
Linuchs
-
Hallo Linuchs,
danke für die Munition
initial-scale=0.01, user-scalable=nofür mein teuflisches Magazin, muss ich gelegentlich mal ausprobieren.Gern, ich weiß allerdings nicht, ob
0.01ein erlaubter Wert fürinitial-scaleist.Bis demnächst
Matthias
-
-
-