Verwendung der oberen MUI-Registerkarte
1Vorwort
Ein leistungsstarkes Front-End-Framework, das dem nativen APP-Erlebnis am nächsten kommt Wichtige Funktionen sind: Pulldown-Aktualisierung, seitlich verschiebbare Navigation, verschiebbares Trigger-Bedienmenü und obere (untere) Registerkarten usw.
Vor Kurzem bin ich bei der Verwendung von MUI auf einen kleinen Fehler gestoßen eine mobile App erstellen. Übrigens habe ich dieses Tab-Top-Webview-Main studiert und werde es hier mit Ihnen teilen.
Homepage-Code
2
<!doctype html><html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<style type="text/css">
.d1{
width: 100%;
height: 50px;
text-align: center;
line-height: 50px;
background-color: #CCCCCC;
}
</style>
</head>
<body>
<p class="d1">我是p1,下面是插入的子页面</p> <!--我们将在这个p下边插入子页面-->
</body>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init({
subpages:[{ //下边是初始化，然后这个页面显示我们将插入的页面
url:"tab-top-webview-main.html",
id:"tab-top-webview-main.html",
styles:{
top:"50px",
bottom:"0px"
}
}]
}) </script></html>Unterseitencode
3
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="css/mui.min.css">
</head>
<body>
<p class="mui-content">
<p id="slider" class="mui-slider mui-fullscreen">
<p id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
<p class="mui-scroll">
<a class="mui-control-item mui-active" href="#item1mobile" data-wid="tab-top-subpage-1.html">
推荐 </a>
<a class="mui-control-item" href="#item2mobile" data-wid="tab-top-subpage-2.html">
热点 </a>
</p>
</p>
</p>
</p>
<script src="js/mui.min.js"></script>
<script src="js/webviewGroup.js" type="text/javascript" charset="utf-8"></script>
<script>
mui.init();
mui.plusReady(function() {
var group = new webviewGroup("tab-top-webview-main.html", {
items: [{
id: "tab-top-subpage-1.html", //这是子页1的路径
url: "tab-top-subpage-1.html",
extras: {}
}, {
id: "tab-top-subpage-2.html", //这是子页2的路径
url: "tab-top-subpage-2.html",
extras: {}
}],
onChange: function(obj) {
var c = document.querySelector(".mui-control-item.mui-active");
if(c) {
c.classList.remove("mui-active");
}
document.querySelector(".mui-scroll .mui-control-item:nth-child(" + (parseInt(obj.index) + 1) + ")").classList.add("mui-active");
}
});
mui(".mui-scroll").on("tap", ".mui-control-item", function(e) {
var wid = this.getAttribute("data-wid");
group.switchTab(wid);
});
});
mui.back = function() {
var _self = plus.webview.currentWebview();
_self.close("auto");
} </script>
</body></html>Code-Erklärung
1. Superansicht der Unterseite tab Das data-wid=""-Attribut von Link a muss auf den entsprechenden Unterseiten-Tab-Pfad gesetzt werden.var group = new webviewGroup("tab-top-webview-main.html", {
items: [{
id: "tab-top-subpage-1.html", //这是子页1的路径
url: "tab-top-subpage-1.html",
extras: {}
}, {
id: "tab-top-subpage-2.html", //这是子页2的路径
url: "tab-top-subpage-2.html",
extras: {}
}]
})<a class="mui-control-item mui-active" href="#item1mobile" data-wid="tab-top-subpage-1.html">
推荐</a>Das obige ist der detaillierte Inhalt vonVerwendung der oberen MUI-Registerkarte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1377
52
So legen Sie den Standardkamerafokus auf dem iPhone 15 Pro fest
Sep 22, 2023 pm 11:53 PM
Beim iPhone 15 Pro-Modell hat Apple drei Brennweitenoptionen für Aufnahmen mit der Hauptkamera eingeführt. In diesem Artikel wird erklärt, was diese Optionen sind und wie Sie Ihre bevorzugte Standardbrennweite zum Aufnehmen von Fotos festlegen. Um die Vorteile des verbesserten Kamerasystems des iPhone 15 Pro und iPhone 15 Pro Max voll auszunutzen, hat Apple den optischen Zoom der Hauptkamera um drei verschiedene Brennweitenoptionen erweitert. Zusätzlich zum Standardmodus 1x (24 mm) hat Apple die Einstellungen 1,2x (28 mm) und 1,5x (35 mm) hinzugefügt. iPhone 15 Pro-Benutzer können beim Fotografieren aus diesen Brennweiten wählen, indem sie einfach auf die 1x-Taste in der Kamera-App tippen. Aus technischen Gründen sind diese jedoch zentral
So verwenden Sie Anführungszeichen in Apple Notes
Oct 12, 2023 pm 11:49 PM
In iOS 17 und macOS Sonoma hat Apple neue Formatierungsoptionen für Apple Notes hinzugefügt, darunter Anführungszeichen und einen neuen Monostyle-Stil. Hier erfahren Sie, wie Sie sie verwenden. Mit zusätzlichen Formatierungsoptionen in Apple Notes können Sie Ihren Notizen jetzt Anführungszeichen hinzufügen. Das Format der Blockzitate erleichtert das visuelle Versetzen von Textabschnitten mithilfe der Anführungszeichenleiste links vom Text. Tippen/klicken Sie einfach auf die Formatschaltfläche „Aa“ und wählen Sie die Option „Blockzitat“ aus, bevor Sie etwas eingeben oder wenn Sie sich in der Zeile befinden, die Sie in ein Blockzitat umwandeln möchten. Diese Option gilt für alle Texttypen, Stiloptionen und Listen, einschließlich Checklisten. Im selben Menü „Format“ finden Sie die neue Option „Einzelstil“. Dies ist eine Überarbeitung der vorherigen „gleichbreiten“
Fix: Die Option „In der Taskleiste andocken' ist unter Windows 11 ausgegraut
Sep 15, 2023 pm 05:35 PM
Die Sprachleiste ist eine wichtige Funktion in Windows, die es Benutzern ermöglicht, schnell zwischen Eingaben zu wechseln, anstatt die Tastenkombination + zu verwenden. Aber in manchen Fällen erscheint die Dock-Option in der Taskleiste in Windows 11 grau. Dieses Problem mit WindowsSpacebar scheint sehr häufig vorzukommen und es gibt keine Lösung. Wir haben versucht, die Spracheinstellungen zu ändern und den Inhalt neu zu konfigurieren, aber ohne Erfolg. Obwohl es uns schließlich gelang, die Grundursache und Lösung zu finden. Warum kann ich die Sprachleiste in der Taskleiste in Windows 11 nicht andocken? Sie haben nur eine Sprache installiert und die Sprachleiste funktioniert nur mit mehreren Sprachen. Die Sprache ist nicht korrekt installiert. Ein Fehler in Windows 11. Beschädigte Systemdateien oder Benutzerprofile. Wenn in W
Analysieren Sie die Verwendung und Klassifizierung von JSP-Kommentaren
Feb 01, 2024 am 08:01 AM
Klassifizierung und Verwendungsanalyse von JSP-Kommentaren JSP-Kommentare werden in zwei Typen unterteilt: einzeilige Kommentare: Mit der Endung kann nur eine einzelne Codezeile kommentiert werden. Mehrzeilige Kommentare: Beginnend mit /* und endend mit */ können Sie mehrere Codezeilen kommentieren. Beispiel für einen einzeiligen Kommentar Beispiel für einen mehrzeiligen Kommentar/**Dies ist ein mehrzeiliger Kommentar*Kann mehrere Codezeilen kommentieren*/Verwendung von JSP-Kommentaren JSP-Kommentare können zum Kommentieren von JSP-Code verwendet werden, um ihn leichter lesbar zu machen
Umgang mit Kontrollkästchen und Radiobuttons in PHP-Formularen
Aug 11, 2023 am 08:39 AM
Umgang mit Kontrollkästchen und Optionsfeldern in PHP-Formularen In der Webentwicklung sind Formulare eine der wichtigsten Möglichkeiten der Dateninteraktion zwischen Anwendungen und Benutzern. In Formularen müssen wir manchmal Kontrollkästchen und Optionsfelder verwenden, um Optionen auszuwählen. In diesem Artikel wird erläutert, wie Sie mit Kontrollkästchen und Optionsfeldern in PHP umgehen. 1. Kontrollkästchenverarbeitung In HTML können wir <inputtype="checkbox&qu" verwenden
So öffnen Sie Internetoptionen im Edge-Browser
Jan 03, 2024 pm 12:49 PM
Freunde, die den IE-Browser verwenden, werden auf jeden Fall die Internetoptionen zum Einrichten verwenden, aber sie können im Edge-Browser nicht gefunden werden. Wie öffnet man ihn also? Tatsächlich müssen Sie zum Einrichten nur den IE-Browser im Edge-Browser öffnen. Wo sind die Internetoptionen des Edge-Browsers: 1. Rufen Sie den Edge-Browser auf und klicken Sie auf die drei Punkte in der oberen rechten Ecke. 2. Wählen Sie in der Taskleiste „Weitere Tools“. 3. Wählen Sie in der neuen Oberfläche „Mit Internet Explorer öffnen“. 4. Klicken Sie oben rechts im neuen Browser auf „Zahnradeinstellungen“. 5. Sie finden „Internetoptionen“ in der Taskleiste. 6. Klicken Sie, um die Einstellungen einzugeben.
Verwendung der WPSdatedif-Funktion
Feb 20, 2024 pm 10:27 PM
WPS ist eine häufig verwendete Office-Software-Suite und die WPS-Tabellenfunktion wird häufig für die Datenverarbeitung und Berechnungen verwendet. In der WPS-Tabelle gibt es eine sehr nützliche Funktion, die DATEDIF-Funktion, die zur Berechnung der Zeitdifferenz zwischen zwei Datumsangaben verwendet wird. Die DATEDIF-Funktion ist die Abkürzung des englischen Wortes DateDifference. Ihre Syntax lautet wie folgt: DATEDIF(start_date,end_date,unit) wobei start_date das Startdatum darstellt.
So verwenden Sie die Exit-Funktion in der C-Sprache richtig
Feb 18, 2024 pm 03:40 PM
Für die Verwendung der Exit-Funktion in der C-Sprache sind bestimmte Codebeispiele erforderlich. In der C-Sprache müssen wir häufig die Ausführung des Programms zu Beginn des Programms beenden oder das Programm unter bestimmten Bedingungen beenden. Die C-Sprache stellt die Funktion „exit()“ zur Implementierung dieser Funktion bereit. In diesem Artikel wird die Verwendung der Funktion „exit()“ vorgestellt und entsprechende Codebeispiele bereitgestellt. Die Funktion „exit()“ ist eine Standardbibliotheksfunktion in der Sprache C und in der Header-Datei enthalten. Seine Funktion besteht darin, die Ausführung des Programms zu beenden und kann eine Ganzzahl annehmen
