jQuery将物体居中,并且转换显示和隐藏
2015-05-31 21:26
627 查看
今天来给大家贴一段代码,代码的作用就是利用jQuery将物体居中,并且转换显示和隐藏;
首先建立一个div标签并且写好css样式,具体如下
然后我想要的效果是当我点击了button这个按钮,test可以居中显示,第二次点击一次test消失,第三次点击又居中显示,这样循环下去;
具体js代码如下:
稍微解释一下代码的意思:
1、$('#test').get(0).flag = true;是为了建立一个标识,告诉浏览器什么时候应该显示,什么时候应该隐藏
2、上面的top就是让浏览器窗口的高度减去自己本身的高度再除以2就是平均高度,同理left也是这样,这里注意一下,页面的头部要加上代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
不然jQuery获取高度可能会无效!
此文章属于王业楼的个人博客原创,若要转载请注明出处:王业楼的个人博客 www.ly89.cn
首先建立一个div标签并且写好css样式,具体如下
然后我想要的效果是当我点击了button这个按钮,test可以居中显示,第二次点击一次test消失,第三次点击又居中显示,这样循环下去;
具体js代码如下:
稍微解释一下代码的意思:
1、$('#test').get(0).flag = true;是为了建立一个标识,告诉浏览器什么时候应该显示,什么时候应该隐藏
2、上面的top就是让浏览器窗口的高度减去自己本身的高度再除以2就是平均高度,同理left也是这样,这里注意一下,页面的头部要加上代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
不然jQuery获取高度可能会无效!
此文章属于王业楼的个人博客原创,若要转载请注明出处:王业楼的个人博客 www.ly89.cn
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- JavaScript演示排序算法
- jQuery Ajax 跨域调用
- jquery教程靠边站,一分钱不花让你免费学会jquery
- JQuery+Strusts1.x无刷新登录
- JQuery 初体验(建议学习jquery)
- Jquery实现的table最后一行添加样式的代码
- jQuery 练习[一] 学习jquery的准备工作
- jquery获得页面元素的坐标值实现思路及代码
- jquery如何实现在加载完iframe的内容后再进行操作
- 批处理实现文本内容居中显示的代码
- jquery $.ajax()取xml数据的小问题解决方法
- jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法
- Jquery 表单取值赋值的一些基本操作
- jQuery中的常用事件总结
- 23个超流行的jQuery相册插件整理分享
- 影响jQuery使用的14个方面
- jQuery 仿百度输入标签插件附效果图
- jQuery学习笔记之jQuery的动画
- jquery通过closest选择器修改上级元素的方法