関連記事 ⇒ さくらのマネージドサーバに変更することに

1月 252012
 







<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>jQuery – CSS :hover class</title>

<style type="text/css">

ul#menu ul { display: none; }

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">



$(function () {



$('#menu > li:has(ul)').hover(

function () { //子メニューを出す

$(this).children('ul').show();

},

function () { //子メニューを隠す

$(this).children('ul').hide();

}

);



});



</script>

</head>



<body>



<ul id="menu">

<li><a href="#">ライオン</a></li>

<li><a href="#">犬</a>

<ul>

<li><a href="#">タロー</a></li>

<li><a href="#">ジロー</a></li>



<li><a href="#">サブロー</a></li>

</ul>

</li>

<li><a href="#">ネコ</a></li>

</ul>



</body>

</html>








Sorry, the comment form is closed at this time.

関連記事はこちら

関連記事はこちら

■関連記事 ⇒ さくらのマネージドサーバに変更することに






じゃらん Web サービス Supported by 楽天ウェブサービス