අන්තර්ක්රියා

පෙළ තේරීම

පරිශීලකයා එය සමඟ අන්තර්ක්‍රියා කරන විට අන්තර්ගතය තෝරා ගන්නා ආකාරය වෙනස් කරන්න.

<p class="user-select-all">This paragraph will be entirely selected when clicked by the user.</p>
<p class="user-select-auto">This paragraph has default select behavior.</p>
<p class="user-select-none">This paragraph will not be selectable when clicked by the user.</p>

පොයින්ටර් සිදුවීම්

මූලද්‍රව්‍ය අන්තර්ක්‍රියා වැළැක්වීමට හෝ එකතු කිරීමට .pe-noneBootstrap සපයයි ..pe-auto

<p><a href="#" class="pe-none" tabindex="-1" aria-disabled="true">This link</a> can not be clicked.</p>
<p><a href="#" class="pe-auto">This link</a> can be clicked (this is default behavior).</p>
<p class="pe-none"><a href="#" tabindex="-1" aria-disabled="true">This link</a> can not be clicked because the <code>pointer-events</code> property is inherited from its parent. However, <a href="#" class="pe-auto">this link</a> has a <code>pe-auto</code> class and can be clicked.</p>

පන්තිය .pe-none(සහ pointer-eventsඑය සකසන CSS ගුණය) පොයින්ටරයක් ​​(මූසිකය, ස්ටයිලස්, ස්පර්ශය) සමඟ අන්තර්ක්‍රියා වළක්වයි. සමඟ සබැඳි සහ පාලනයන් .pe-none, පෙරනිමියෙන්, යතුරුපුවරු භාවිතා කරන්නන් සඳහා තවමත් නාභිගත කළ හැකි සහ ක්‍රියා කළ හැකි ය. යතුරුපුවරු භාවිතා කරන්නන් සඳහා පවා ඒවා සම්පූර්ණයෙන්ම උදාසීන කර ඇති බව සහතික කිරීම සඳහා, ඔබට tabindex="-1"(ඔවුන්ට යතුරුපුවරු නාභිගත වීම වැළැක්වීමට) සහ aria-disabled="true"(සහායක තාක්‍ෂණයන්ට ඒවා ඵලදායි ලෙස අක්‍රිය කර ඇති බව ප්‍රකාශ කිරීමට) සහ සමහර විට ජාවාස්ක්‍රිප්ට් භාවිතා කිරීමට අවශ්‍ය විය හැක. ඒවා ක්‍රියාත්මක වීමෙන් සම්පූර්ණයෙන්ම වළක්වන්න.

හැකි නම්, සරල විසඳුම වන්නේ:

• පෝරම පාලන සඳහා, disabledHTML ගුණාංගය එක් කරන්න.

• සබැඳි සඳහා, hrefගුණාංගය ඉවත් කරන්න, එය අන්තර්ක්‍රියාකාරී නොවන නැංගුරමක් හෝ ස්ථාන දරන්නා සබැඳියක් බවට පත් කරන්න.

සාස්

උපයෝගිතා API

අන්තර්ක්‍රියා උපයෝගිතා අපගේ උපයෝගිතා API හි ප්‍රකාශ කර ඇත scss/_utilities.scss. උපයෝගිතා API භාවිතා කරන්නේ කෙසේදැයි ඉගෙන ගන්න.

    "user-select": (
      property: user-select,
      values: all auto none
    ),
    "pointer-events": (
      property: pointer-events,
      class: pe,
      values: none auto,
    ),