Jquery 滑入滑出效果实现代码
作者:bea
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> <scri
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供个人记录学习笔记,如有错误欢迎指出!
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- javascript中的107个基础知识收集整理 推荐
- jquery CSS选择器笔记
- Tinymce+jQuery.Validation使用产生的BUG
- javascript delete 使用示例代码
- JavaScript 格式字符串的应用
- js DataSet数据源处理代码
- javascript 变态的节点集合
- javascript 节点遍历函数
- javascript 类型判断代码分析
- js chrome浏览器判断代码
- javascript 跨浏览器的事件系统
- javascript 深拷贝
- JavaScript 学习笔记二 字符串拼接
- jQuery 美元符冲突的解决方法
- 分享十五个最佳jQuery 幻灯插件和教程
- Jquery 1.42 checkbox 全选和反选代码
- 网络图片延迟加载实现代码 超越jquery控件
- JQuery的一些小应用收集
- Visual Studio中的jQuery智能提示设置方法