Kufichwa cha Bootstrap 5

Kuzingatia kina

Kuzingatia kina (Popover) komponendi linahusiana na kuzingatia kina; ni kuzingatia kina ambalo inatokana na kuzingatia kina kwa sababu inaonekana kwa uwanja wa mtu kwa uwanja wa kina. Kina inafikia na kina zaidi.

Kuhakikisha kuzingatia kina

Kuzingatia kina, tuma data-bs-toggle="popover" Mwongozo wa kuzingatia kwa kuingia katika elementi.

Tumia title Mwongozo wa kuzingatia mawazo ya kichwa cha kuzingatia, na tumia data-bs-content Mwongozo wa kuzingatia mawazo katika mawazo ya kuzingatia:

<button type="button" class="btn btn-primary" data-bs-toggle="popover" title="Kichwa cha kuzingatia" data-bs-content="Mawazo ya kuzingatia kina">Kichapa kuzingatia</button>

Taradhisya:Kuzingatia kina lazima iweze kuandikwa na JavaScript ili kuwa na maadili.

Maelezo yaliyotumiwa hapa ni kufungua kuzingatia kuzingatia kwenye mawili yote ya siku hizi:

Mifano

<script>
var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'))
var popoverList = popoverTriggerList.map(function (popoverTriggerEl) {
  kutumia new bootstrap.Popover(popoverTriggerEl)
})
</script>

Mwongozo wa kumwambaa

Kuzingatia upeo wa kuzingatia

Kwa msingi, kuzingatia kina kuzingatia kwenye upeo wa kulia wa elementi.

Tumia data-bs-placement Mwongozo wa kuzingatia upeo wa kuzingatia katika elementi kwenye upeo wa kati, chini, kushoto au kulia:

Mifano

<a href="#" title="Header" data-bs-toggle="popover" data-bs-placement="top" data-content="Content">Mwili</a>
<a href="#" title="Header" data-bs-toggle="popover" data-bs-placement="bottom" data-content="Content">Chini cha chini</a>
<a href="#" title="Header" data-bs-toggle="popover" data-bs-placement="left" data-content="Matokeo">Kulia</a>
<a href="#" title="Header" data-bs-toggle="popover" data-bs-placement="right" data-content="Matokeo">Kushoto</a>

Mwongozo wa kumwambaa

Taradhisya:Ikiwa haujafikia kwa uwanja wa kufikia, rangia ya placement inahitaji kufanya kwa hali yako ya kwanza. Kwa mfano: Ikiwa umeona kwa eneo la juu (bila eneo la kufikia), rangia ya placement ya juu inaweza kuwa kufichwa kwenye eneo la chini au kushoto (kwenye eneo ndefu).

Kufichia rangia

Kwa kawaida, kufichia rangia mara ya pili kwa kiwango cha elementi kinaenda kufichwa. lakini, unaweza kutumia data-bs-trigger="focus" Mwili, kufichia rangia hauwezi kuwa kwa hali yako ya kwanza kufichia rangia. lakini, unaweza kutumia

Mifano

<a href="#" title="Dismissible popover" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-content="Tukio la kufichwa kwenda kufikia hali yoyote ya kitabu kinaweza kufichwa hii rangia">Tukio la kufichwa kwenda</a>

Mwongozo wa kumwambaa

Kufichwa kwa kushangaza

Msaada:Ikiwa unahitaji kuonewa kufichwa kwenda kiwango cha elementi, tumia thamani ya "hover" kwa data-bs-trigger Mwili:

Mifano

<a href="#" title="Header" data-bs-toggle="popover" data-bs-trigger="hover" data-bs-content="Matukio ya kufichwa">Tukio la kushangaza juu</a>

Mwongozo wa kumwambaa