私はJQueryが初めてです
このスレッドは私の古いスレッドと半分重複しています
主な問題は、マウスが指している現在のアイテムの周りにボックスを作成したいということです。マウスがそのアイテムを離れると、ボックスが消えます。
<script src="Scripts/jquery-1.10.1.min.js" type="text/javascript"></script>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<div class="clickable" url="http://www.google.com">
Google
</div>
<div class="clickable" url="http://www.bing.com">
Bing
</div>
<script type="text/javascript">
$("div.clickable").mouseover(function () {
// $(this).css("outline-style", "solid");
// $(this).css("outline-color", "Navy");
// $(this).css("outline-width", "thin");
$("#div.clickable").each(function () { $(this).removeClass("Selected") });
$(this).addClass("Selected");
});
</script>
<script type="text/javascript">
$("div.clickable").click(
function () {
window.location = $(this).attr("url");
});
</script>
そしてスタイルは
.clickable
{
cursor:pointer;
cursor: hand;
}
.Selected
{
outline-style:solid;
outline-color:Navy;
outline-width:thin;
}
それでも、マウスが他のアイテムの上に移動すると機能しません。前の項目のアウトラインをクリアしません。