watching you

Merkmale

• Seien Sie in der Lage, die Maus oder ein anderes DOM zu beobachten oder sogar Werte einzugeben, alles, was Sie wollen!
• Da es DOM-basiert ist, ist es einfach, RWD zu unterstützen
• Unterstützt mehrere Frameworks
• Null Abhängigkeit (jedes Framework ist!)
• Geschrieben in TypeScript
• Die Größe des Kerncodes beträgt nur 3 KB nach GZIP -Komprimierung
• Wenn sich das Element nicht auf dem Bildschirm befindet, wird automatisch nicht mehr zu sehen

Beispiel

• Anmeldeformular
• Eisenkette
• Cena beobachtet dich
• SVG -Pfadbeobachter

Der Quellcode finden Sie hier

Storybook

Wenn Sie mit React das Storybook ansehen, kann jedes Framework dasselbe tun!

https://jj811208.github.io/watching-you/storybook

Unterlagen

Euen Die API kann sich noch ändern, bis Version 1.0.0 veröffentlicht wurde Euen

• Vanilla.js
• Reagieren
• Vue

Kompatibilität

Wenn Sie watching-you direkt ohne Compiler (Babel) verwenden (z. B. WordPress-Projekt mit CDN Import watching-you ))

	Chrom	Firefox	Safari	Rand	Oper	IOS Safari/Chrom	Android Chrome
Unterstützt	70+	73+	14.1+	80+	70+	14.1+	✔

Wenn Sie jedoch einen Compiler wie Babel und importieren, kann er IE11 sogar unterstützen

Einige Referenzen:
https://babeljs.io/
https://github.com/vitejs/vite/tree/main/packages/plugin-legacy

Notiz

• Beim Anschauen input oder textarea muss das Attribut text-align left
• Einige Inline -Elemente ignorieren das transform (sagen wir span ), sodass Sie ihnen das display -Attribut geben müssen, um ordnungsgemäß zu funktionieren. (Siehe: https://stackoverflow.com/questions/24961795/how-can-i-use-scss3-transform-on-a-span)
• Möglicherweise benötigen Sie so etwas wie transition: transform .1s je nach Ihren Anforderungen

Lizenz

ISC