您的位置：首页 > Web前端 > JQuery

【code】jQuery实现鼠标滑过标题显示其后内容

2015-12-09 15:28 776 查看

<html>
<head>
<meta charset="utf-8">
<title>鼠标滑过事件</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<div id="panel">
<h5 class="head">什么是jQuery？</h5>
<div class="content">是继Prototype之后又一个优秀的JavaScript库，它是由John Resig创建于2006年1月份的开源项目。jQuery凭借简洁的语法和跨平台的兼容性，极大的简化了JavaScript开发人员遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax。它独特而又优雅的代码风格改变了JavaScript程序员的设计思路和编写程序的方法
</div>
</div>
<script type="text/javascript" src="../scripts/jquery.js"></script>
<script type="text/javascript">
$(function(){

$("#panel h5.head").mouseover(function(){
$(this).next().show();
}).mouseout(function(){
$(this).next().hide();
})

})
</script>
<!--用hover（）方法实现该功能-->
<script type="text/javascript">
/*$("#panel h5.head").hover(function(){
$(this).next().show();
},function(){
$(this).next().hide();
})*/
</script>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航