質問があります:ulにカーソルを合わせたときにツールチップ要素を削除するにはどうすればよいですか?私はこのhtmlコードを持っています:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="col s12 offset-s4">
<script type="text/javascript">
$(document).ready (function() {
$('select').material_select();
$('select').material_select('destroy');
$('.tooltipped').tooltip({delay: 50});
});
</script>
<a id="tool-new" class="tooltipped" data-tooltip="Please select more than one category" data-position="right" data-delay="120">
<select class="and-or" id="And_Or" name="a_o[]">
<option value="4" selected="selected">And</option>
<option value="5">Or</option>
</select>
</a>
選択ボックスが無効になっているときにツールチップにカーソルを合わせたいだけです。ただし、選択ボックスが無効になっておらず、正常に機能している場合は、要素を削除して、ツールチップが非表示になるようにします。あなたは私を助けることができます??私は、デザインの非常に優れたフレームワークであるmaterializecssを使用しています。
ulのmouseover
イベントでjQueryを作成しました。マウスがulに移動するたびに、ツールチップが非表示になり、コードを確認します
$(document).ready (function() {
$('select').material_select();
$('.tooltipped').tooltip({delay: 50});
});
$('select').material_select('destroy');
$('body').on("mouseover",'.dropdown-content', function(){
$("#tool-new").tooltip("hide");
})
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="col s12 offset-s4">
<a id="tool-new" class="tooltipped" data-tooltip="Please select more than one category" data-position="right" data-delay="120">
<select class="and-or" id="And_Or" name="a_o[]">
<option value="4" selected="selected">And</option>
<option value="5">Or</option>
</select>
</a>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加