Heim  >  Artikel  >  Web-Frontend  >  Wozu dient Popover im Bootstrap?

Wozu dient Popover im Bootstrap?

WBOY
WBOYOriginal
2021-12-29 15:55:572777Durchsuche

In Bootstrap wird das Popover-Plugin verwendet, um ein Popup-Feld mit bestimmten Inhalten und Tags zu generieren. Sie können das Datenattribut und JavaScript verwenden, um ein Popup-Feld hinzuzufügen. popover"" und "$(element).popover(" bzw. Optionen)".

Wozu dient Popover im Bootstrap?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, Bootstrap-Version 3.3.7, DELL G3-Computer

Was ist die Verwendung von Popover in Bootstrap?

Popover ähnelt Tooltip Provides eine erweiterte Ansicht. Um das Popover zu aktivieren, bewegen Benutzer einfach den Mauszeiger über das Element. Der Inhalt der Popup-Box kann mithilfe der Bootstrap Data API vollständig gefüllt werden. Diese Methode basiert auf Tooltips.

Popover-Plug-ins generieren Inhalte und Markups bei Bedarf. Popovers werden standardmäßig hinter ihren auslösenden Elementen platziert. Sie können ein Popover auf zwei Arten hinzufügen:

Über das Datenattribut: Um ein Popover hinzuzufügen, fügen Sie einfach data-toggle="popover" zu einem Anker-/Schaltflächen-Tag hinzu. Der Titel des Ankers ist der Text des Popovers. Standardmäßig platziert das Plugin das Popover oben.

Ein Beispiel ist wie folgt:

<a href="#" data-toggle="popover" title="Example popover">    请悬停在我的上面</a>

Über JavaScript: Popover über JavaScript aktivieren:

Ein Beispiel ist wie folgt:

$(&#39;#identifier&#39;).popover(options)

Das Popover-Plugin ist kein reines Popup wie die Dropdown-Menüs und andere Plugins, die zuvor besprochen wurden. Um das Plugin nutzen zu können, müssen Sie es mit jquery (Javascript lesen) aktivieren. Verwenden Sie das folgende Skript, um alle Popovers auf der Seite zu aktivieren:

$(function () { $("[data-toggle=&#39;popover&#39;]").popover(); });

Empfohlenes Lernen: „Tutorial zur Bootstrap-Nutzung

Das obige ist der detaillierte Inhalt vonWozu dient Popover im Bootstrap?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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