#html #twitter-bootstrap
#HTML #twitter-bootstrap
Вопрос:
Я хочу, чтобы пользователь мог выбирать все в рамках морфологического преобразования (размывание, расширение, открытие, закрытие), но не само «морфологическое преобразование». Спасибо за каждый ответ!
HTML-код:
<div class="container">
<div class="row">
<hr>
<div class="dropdown">
<a id="dLabel" role="button" data-toggle="dropdown" class="btn btn-primary" data-target="#" href="/page.html">
Select Pre-Processing Method <span class="caret"></span>
</a>
<ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
<li><a href="#">Normalisation</a></li>
<li><a href="#">Canny Edge Detection</a></li>
<li><a href="#">Smoothing</a></li>
<li><a href="#"></a></li>
<li class="divider"></li>
...
<li class="dropdown-submenu">
<a tabindex="-1" href="#">Morphological Transformation</a>
<ul class="dropdown-menu">
<li><a>Erosion</a></li>
<li><a>Dilation</a></li>
<li><a>Opening</a></li>
<li><a>Closing</a></li>
</ul>
</li>
...
</ul>
</li>
</ul>
</div>
</div>
Комментарии:
1. Рассматривали ли вы возможность добавления
.disabled
кli
элементу? getbootstrap.com/components/#dropdowns-disabled2. Я пробовал это, но это не сработало, потому что пользователям I нужно иметь возможность щелкнуть по нему, чтобы отобразить подменю. В любом случае спасибо.
Ответ №1:
Вы можете отключить привязку событий и сохранить эффекты наведения, используя это:
.disabled-link:hover{
background: red;
}
.disabled-link:active{
pointer-events: none;
}
<a href="www.google.com" class="disabled-link">Test</a>
Его можно использовать во всех современных браузерах: нажмите!