jQuery implementiert den Fall der Schriftgrößenanpassung
|
In diesem Artikel wird der spezifische Code von jQuery zum Anpassen der Schriftgröße zu Ihrer Information bereitgestellt. Der spezifische Inhalt ist wie folgt
Code:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta http-equiv="X-UA-kompatibel" content="IE=edge">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>Schriftart festlegen</title>
</Kopf>
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
<Skripttyp="text/javascript">
$(Funktion() {
$("span").klick(function() {
var cssFontSize = $("#para").css("font-size"); //Schriftgröße abrufen var fontSize = parseFloat(cssFontSize); //Wert der Schriftgröße abrufen var unit = cssFontSize.slice(-2); //Einheit der Schriftgröße abrufen var className = $(this).attr("class");
if ("zoomIn" == className) { //Schrift vergrößern if (fontSize <= 22) {
Schriftgröße += 2;
}
} else if ("zoomOut" == className) { //Schriftart verkleinern if (fontSize >= 12) {
Schriftgröße -= 2;
}
}
$("#para").css("Schriftgröße", Schriftgröße + Einheit);
});
});
</Skript>
<!-- CSS -->
<style type="text/css">
.zoomIn, .zoomOut {
Hintergrund: blau;
Cursor: Zeiger;
}
</Stil>
</Kopf>
<!-- HTML -->
<Text>
<div Klasse="Nachricht">
<div Klasse="msg_caption">
<span class="zoomIn">Vergrößern</span>
<span class="zoomOut">Verkleinern</span>
</div>
<div>
<p id="Absatz">
jQuery ist ein schnelles und kompaktes JavaScript-Framework. Es ist nach Prototype eine weitere hervorragende JavaScript-Codebibliothek (Framework) und wurde im Januar 2006 von John Resig veröffentlicht. <br />
Das Designprinzip von jQuery lautet „Weniger schreiben, mehr tun“, was dafür plädiert, weniger Code zu schreiben und mehr Dinge zu tun. <br />
Es kapselt häufig verwendete JavaScript-Funktionscodes und bietet einen einfachen JavaScript-Entwurfsmodus zur Optimierung von HTML-Dokumentvorgängen, Ereignisverarbeitung, Animationsdesign und Ajax-Interaktion. <br />
Die Kernfunktionen von jQuery können wie folgt zusammengefasst werden: einzigartige Kettensyntax und kurze, klare und multifunktionale Schnittstelle; effiziente und flexible CSS-Selektoren und die Möglichkeit, CSS-Selektoren zu erweitern; <br />
Es verfügt über einen praktischen Plug-In-Erweiterungsmechanismus und umfangreiche Plug-Ins. jQuery ist mit verschiedenen gängigen Browsern kompatibel, wie etwa IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+ usw.</p>
</div>
</div>
</body>
</html>Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Ausführliches Tutorial zur Installation von WinX64 unter MySQL8.0.18 (mit Bildern und Text)
>>: Implementierung von Nginx-Weiterleitungsübereinstimmungsregeln
Artikel empfehlen
Lösung für das Problem des MySQL-Master-Slave-Switch-Kanals
Nach der VIP-Konfiguration wird beim Aktiv/Standb...
Zusammenfassung der Installationsschritte und aufgetretenen Probleme beim Dekomprimieren der Version mysql5.7.24
1. Herunterladen https://dev.mysql.com/downloads/...
Detaillierte Erklärung der Javascript-Grundlagen
Inhaltsverzeichnis Variable Datentypen Erweiterun...
Einführung in die Einrichtung von Tomcat für den automatischen Start auf einem Linux-System
1. Wechseln Sie in das Verzeichnis /etc/init.d: ...
js implementiert einen einzigen Klick zum Ändern der Tabelle
Pure js implementiert eine mit einem Klick bearbe...
Zusammenfassung gängiger Befehle zur Linux-Benutzer- und Gruppenverwaltung
Dieser Artikel fasst die allgemeinen Befehle zur ...
Mysql-Datenbankdesign - Analyse von drei Paradigmenbeispielen
Drei Paradigmen 1NF: Felder sind untrennbar; 2NF:...
Nginx-Konfiguration und -Kompatibilität mit der Codeanalyse der HTTP-Implementierung
Generieren Sie SSL-Schlüssel und CSR-Datei mit Op...
Tutorial zu HTML-Tabellen-Tags (32): Attribut für horizontale Zellenausrichtung ALIGN
In horizontaler Richtung können Sie die Zellenaus...
Farbschemata für Websites Die richtigen Farben für Ihre Website auswählen
Beeinflusst Farbe die Website-Besucher? Vor einig...
Lösen Sie das Problem der Inkonsistenz zwischen MySQL-Zeit und Systemzeit in Docker
Als ich kürzlich MySQL in Docker installierte, st...
Beispiel für eine adaptive CSS-Bildschirmgrößenimplementierung
Um eine CSS-Bildschirmgrößenanpassung zu erreiche...
Detailliertes Beispiel des MySQL InnoDB-Sperrmechanismus
1. InnoDB-Sperrmechanismus Die InnoDB-Speicher-En...
Beispieloperation MySQL Kurzlink
So richten Sie einen MySQL-Kurzlink ein 1. Überpr...
Detaillierte Erläuterung des grafischen Tutorials zum Herunterladen, Installieren und Konfigurieren von Win10 DVWA (Lernen von Anfängern)
Das Computersystem wurde neu installiert und die ...