浮动的div自适应居中显示的js代码


Posted in Javascript onDecember 23, 2013

当div是浮动的时候浏览器窗口发生变化的时候不能居中显示(因为浮动的时候一般设定的有left或者right值)

可以先用jquery获取外围的div随浏览器变化而变化的宽度(加上监听事件)

之后再获取div的宽度 例如:

function autoWidth(){
     var bW = $(".call_man").width();//外围的div
     var popWidth = (bW-150)/2    //(150是div的宽度)
    $(".rts").css("left",popWidth);  //把取得值赋给div 就是div距离左侧的距离
}
autoWidth();
window.onresize = autoWidth;//监听事件
Javascript 相关文章推荐
JQuery AJAX实现目录浏览与编辑的代码
Oct 21 Javascript
JavaScript中的prototype和constructor简明总结
Apr 05 Javascript
jQuery中removeProp()方法用法实例
Jan 05 Javascript
jquery实现点击向下展开菜单项(伸缩导航)效果
Aug 22 Javascript
基于JS实现导航条flash导航条
Jun 17 Javascript
全面解析JS字符串和正则表达式中的match、replace、exec等函数
Jul 01 Javascript
jQuery插件Easyui设置datagrid的pageNumber导致两次请求问题的解决方法
Aug 06 Javascript
Vue.js学习笔记之 helloworld
Aug 14 Javascript
详解AngularJS1.x学习directive 中‘& ’‘=’ ‘@’符号的区别使用
Aug 23 Javascript
element-ui 时间选择器限制范围的实现(随动)
Jan 09 Javascript
小程序云开发获取不到数据库记录的解决方法
May 18 Javascript
JS实现前端路由功能示例【原生路由】
May 29 Javascript
javascript实现简单的Map示例介绍
Dec 23 #Javascript
js购物车实现思路及代码(个人感觉不错)
Dec 23 #Javascript
让jQuery与其他JavaScript库并存避免冲突的方法
Dec 23 #Javascript
js写的评论分页(还不错)
Dec 23 #Javascript
用js来刷新当前页面保留参数的具体实现
Dec 23 #Javascript
jquery插件jTimer(jquery定时器)使用方法
Dec 23 #Javascript
jquery实现图片翻页效果
Dec 23 #Javascript
You might like
php下关于中英数字混排的字符串分割问题
2010/04/06 PHP
深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念
2013/06/06 PHP
执行、获取远程代码返回:file_get_contents 超时处理的问题详解
2013/06/25 PHP
PHP迭代器和生成器用法实例分析
2019/09/28 PHP
PHP检查文件是否存在,不存在自动创建及读取文件内容操作示例
2020/01/23 PHP
JavaScript 编程引入命名空间的方法与代码
2007/08/13 Javascript
json格式化/压缩工具 Chrome插件扩展版
2010/05/25 Javascript
js jquery数组介绍
2012/07/15 Javascript
cument.execCommand()用法深入理解
2012/12/04 Javascript
AngularJS中$apply方法和$watch方法用法总结
2016/12/13 Javascript
jquery实现图片轮播器
2017/05/23 jQuery
nodejs中安装ghost出错的原因及解决方法
2017/10/23 NodeJs
setTimeout时间设置为0详细解析
2018/03/13 Javascript
使用Angular CLI生成路由的方法
2018/03/24 Javascript
vue动态删除从数据库倒入列表的某一条方法
2018/09/29 Javascript
详解Vue.js中引入图片路径的几种方式
2019/06/17 Javascript
微信小程序纯文本实现@功能
2020/04/08 Javascript
[06:40]2014DOTA2西雅图国际邀请赛 DK战队巡礼
2014/07/07 DOTA
在Python的Django框架中获取单个对象数据的简单方法
2015/07/17 Python
python 读写txt文件 json文件的实现方法
2016/10/22 Python
python字典操作实例详解
2017/11/16 Python
Python实现将一个正整数分解质因数的方法分析
2017/12/14 Python
django 多数据库配置教程
2018/05/30 Python
matlab 计算灰度图像的一阶矩,二阶矩,三阶矩实例
2020/04/22 Python
Python求区间正整数内所有素数之和的方法实例
2020/10/13 Python
python中实现栈的三种方法
2020/12/19 Python
在HTML5 canvas里用卷积核进行图像处理的方法
2018/05/02 HTML / CSS
将SVG图引入到HTML页面的实现
2019/09/20 HTML / CSS
工会换届选举方案
2014/05/21 职场文书
合理化建议书
2015/02/04 职场文书
消防安全月活动总结
2015/05/08 职场文书
运动会加油稿30字
2015/07/21 职场文书
超市店长竞聘书
2015/09/15 职场文书
Go缓冲channel和非缓冲channel的区别说明
2021/04/25 Golang
解决sql server 数据库,sa用户被锁定的问题
2021/06/11 SQL Server
MySQL串行化隔离级别(间隙锁实现)
2022/06/16 MySQL