Jquery 滑入滑出效果实现代码
更新时间：2010年03月27日 00:50:11 作者：
Jquery 滑入滑出效果实现代码，需要的朋友可以参考下。
CSS
<style type="text/css">
#divD{
width:300px;
height:100px;
background-color:#CC99FF;
}
</style>
Jquery代码
<script type="text/javascript" src="bg/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btnFadein").bind("click",Fadein); //为btnFadein绑定click时间
$("#btnFadeout").bind("click",Fadeout); //为btnFadeout绑定click时间
})
function Fadein(){
$("#divD").slideDown("slow"); //滑入
}
function Fadeout(){
$("#divD").slideUp("slow"); //滑出
}
</script>
HTML
<body>
<input type="button" value="滑入" id="btnFadein" />
<input type="button" value="滑出" id="btnFadeout"/>
<div id="divD">这是div</div>
DIV
</body>
O(∩_∩)O每天进步一点点O(∩_∩)O 该BLOG供个人记录学习笔记，如有错误欢迎指出！
复制代码 代码如下:
<style type="text/css">
#divD{
width:300px;
height:100px;
background-color:#CC99FF;
}
</style>
Jquery代码
复制代码 代码如下:
<script type="text/javascript" src="bg/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btnFadein").bind("click",Fadein); //为btnFadein绑定click时间
$("#btnFadeout").bind("click",Fadeout); //为btnFadeout绑定click时间
})
function Fadein(){
$("#divD").slideDown("slow"); //滑入
}
function Fadeout(){
$("#divD").slideUp("slow"); //滑出
}
</script>
HTML
复制代码 代码如下:
<body>
<input type="button" value="滑入" id="btnFadein" />
<input type="button" value="滑出" id="btnFadeout"/>
<div id="divD">这是div</div>
DIV
</body>
O(∩_∩)O每天进步一点点O(∩_∩)O 该BLOG供个人记录学习笔记，如有错误欢迎指出！
相关文章
本文主要对jQuery中的DOM操作进行了详细全面的介绍。文中举了简单例子，便于理解与学习，对初学者具有很好的参考价值，需要的朋友一起来看下吧2016-12-12
浅析jQuery(function(){})与(function(){})(jQuery)之间的区别
本篇文章主要是对jQuery(function(){})与(function(){})(jQuery)之间的区别进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-01-01
jQuery获得包含margin的outerWidth和outerHeight的方法
这篇文章主要介绍了jQuery获得包含margin的outerWidth和outerHeight的方法,涉及jQuery中outerWidth及outerHeight方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
这篇文章主要介绍了jQuery实现的简单折叠菜单(折叠面板)效果代码,涉及jQuery中slideToggle与toggleClass方法的灵活使用技巧,需要的朋友可以参考下2015-09-09
jquery ajax 同步异步的执行示例代码，需要的朋友可以参考下。2010-06-06
以前针对DOM元素的插件(即$.fn.)存临时数据都加在当前元素上建个特殊的属性来存,(JQ内部直接也搞这样的)2010-08-08
本篇文章是对在Jquery中模板数据绑定插件的使用方法进行了详细的分析介绍，需要的朋友参考下2013-07-07
这篇文章主要介绍了jQuery实现的网页右下角tab样式在线客服效果代码,涉及jQuery简单样式变换控制技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-10-10
本篇文章是对JQuery-tableDnD拖拽的基本使用进行了详细的分析介绍，需要的朋友参考下2013-07-07
现在任何事务都追求效率和人性化，当然网页效果也是如此，如果一个可以编辑数据的表格，编辑到最后一行的时候，点击可以自动添加一行，这样算是一个比较人性化的效果，可以免去一丝劳顿之苦，下面分享一段这样的代码2016-01-01
最新评论