Heim > Web-Frontend > CSS-Tutorial > Wie erreicht man die Funktionalität „width: calc(100% - 100px)' mit jQuery?

Wie erreicht man die Funktionalität „width: calc(100% - 100px)' mit jQuery?

Patricia Arquette
Freigeben: 2024-12-14 13:25:11
Original
652 Leute haben es durchsucht

How to Achieve `width: calc(100% - 100px)` Functionality Using jQuery?

Alternative zu CSS width:calc(100% -100px) Verwendung von jQuery für Kompatibilität

Suche nach einer kreuzkompatiblen Alternative zu CSS „width : calc(100% -100px)", das die gewünschte Funktionalität bereitstellt, aber möglicherweise nicht allgemein unterstützt wird, kann man sich an wenden jQuery.

jQuery-Lösung:

jQuery bietet eine einfache Methode zum Replizieren des CSS-Ausdrucks für Browser, die diese nicht unterstützen:

$('#yourEl').css('width', '100%').css('width', '-=100px');
Nach dem Login kopieren

Dies Der Code weist dem Zielelement eine Breite von 100 % zu und subtrahiert dann 100 Pixel von seinem Breitenwert. Dies ahmt effektiv die Funktionalität von „width: calc(100% -100px)“ nach und macht es reaktionsfähig und kompatibel mit Browsern, die den calc-Ausdruck nicht nativ unterstützen.

Die Fähigkeit von jQuery, relative Berechnungen mühelos durchzuführen, macht diese Methode zu einem Kinderspiel eine bequeme und zuverlässige Alternative zur manuellen Durchführung der Berechnung selbst.

Das obige ist der detaillierte Inhalt vonWie erreicht man die Funktionalität „width: calc(100% - 100px)' mit jQuery?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage