没有合适的资源?快使用搜索试试~ 我知道了~
温馨提示
试读
2页
本文实例讲述了jquery实现隐藏在左侧的弹性弹出菜单效果。分享给大家供大家参考。具体如下: 这是一款隐藏在左侧的弹性弹出菜单,从淘宝扣下来的,也可作为JavaScript缓冲动画的典型教程。本弹性菜单可扩展性强,实际上不光可以做成菜单,也可布局一些图文混排的内容或一段视频,总之被弹出的内容是在一段Div内,怎么布置就看你的了。 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-left-hidden-alert-adv-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTM
资源推荐
资源详情
资源评论
jquery实现隐藏在左侧的弹性弹出菜单效果实现隐藏在左侧的弹性弹出菜单效果
本文实例讲述了jquery实现隐藏在左侧的弹性弹出菜单效果。分享给大家供大家参考。具体如下:
这是一款隐藏在左侧的弹性弹出菜单,从淘宝扣下来的,也可作为JavaScript缓冲动画的典型教程。本弹性菜单可扩展性强,
实际上不光可以做成菜单,也可布局一些图文混排的内容或一段视频,总之被弹出的内容是在一段Div内,怎么布置就看你的
了。
运行效果截图如下:
在线演示地址如下:
http://demo.jb51.net/js/2015/jquery-left-hidden-alert-adv-codes/
具体代码如下:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>隐藏在左侧的弹性弹出菜单</title>
<script type="text/javascript" src="jquery1.3.2.js"></script>
<script language="javascript">
$(function(){
$("#clickopen").click(function(){
var offset=$("#clickopen").offset().top;
$("#page").css("top",offset+"px");
$("#clickopen").hide();
$("#page").animate({
width: "400px",
height: "400px",
left: ($("body").width()/2-200)+"px",
top: (offset-100)+"px",
opacity: 'toggle'
}, 300 );
return false;
})
$("#closepage").click(function(){
var offset=$("#page").offset().top;
$("#page").animate({
width: "0px",
height: "0px",
left: "0px",
top: (offset+100)+"px",
opacity: 'toggle'
}, 300 );
资源评论
weixin_38524871
- 粉丝: 6
- 资源: 936
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功