浮动的div无论窗口大小变化都能居中显示的js
当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;//监听事件
浮动的div无论窗口大小变化都能居中显示的js的更多相关文章
- div中img依据不同分辨率居中显示,超出部分隐藏
在做banner居中时 碰到的问题,知道可以用背景图实现居中显示,但是内心是想深究下的,故找到几种办法收集一下,后面两种真的是奇技淫巧 来着下面两处 https://www.zhihu.com/que ...
- 浮动后的 <li> 如何在 <ul> 中居中显示?
百度了许久都没有满意的解决方案,现在终于搞定了. 其实,只要 ul 的父元素 css 样式设了 text-align: center; 然后 ul 设了 display: inline-block; ...
- 图片大于div时的居中显示
当图片大于div时,想要图片居中显示,如果图片等比例缩小可能会导致图片不能填充整个div,如果直接将图片不设置宽高,将其外层div设置overflow:hidden:这时即使外层div设置了水平垂直居 ...
- 使DIV相对窗口大小左右拖动始终水平居中
<!doctype html> <html> <head> <meta http-equiv="content-type" content ...
- 监听窗口大小变化,改变画面大小-[Three.js]-[onResize]
如果没有监听窗口变化,将会出现一下情况: ![](https://img2018.cnblogs.com/blog/1735896/202001/1735896-20200102081845027-2 ...
- 让内层浮动的Div将外层Div撑开 -----清浮动
清浮动的好处写多了都能体会到,解决高度塌陷, 一般情况下是要清除浮动的,不然会影响下面标签的排版. <div class="parent" style="width ...
- Jquery 操作页面中iframe自动跟随窗口大小变化,而页面不出现滚动条,只在iframe内部出滚动条
很多时候大家需要iframe自适应所加载的页面高度而不要iframe滚动条,但是这次我需要的是页面不需要滚动条而iframe要滚动条,且iframe自动跟随窗口大小变化.自适应页面大小.下面是代码,下 ...
- MFC控件随窗口大小变化原理及实现
本文主要针对MFC的dialog,实现控件随窗口大小变化. 原理:首先获取dialog的初始大小,当窗口发送变动时,调用OnSize事件和方法,计算缩放比例,然后对界面中的所有控件进行缩放和布局. 实 ...
- Qt5:随窗口大小变化背景图片自动缩放的实现
在窗口程序中,当我们改变窗口大小的时候,背景图片通常会岁窗口大小变化而缩放 然而,在我们写的窗口程序中,设置背景图片后,如果缩放大小,会看到背景图片并不会随之缩放, 应为这需要特殊处理,一般常用的方法 ...
随机推荐
- BZOJ4869:[SHOI2017]相逢是问候——题解
http://www.lydsy.com/JudgeOnline/problem.php?id=4869 题面复制于洛谷:https://www.luogu.org/problemnew/show/P ...
- selenium测试-open chrome
通过selenium来打开浏览器测试之前,需要确认本地已安装相应的webdriver,本例以chrome为例. 1. 查看本地chrome版本,以此确认需要安装的webdriver版本 查看chrom ...
- hzwer分块九题(暂时持续更新)
hzwer分块9题 分块1:区间加法,单点查询 Code #include<bits/stdc++.h> #define in(i) (i=read()) using namespace ...
- 手脱ACProtect V1.4X(有Stolen Code)
1.载入PEID ACProtect V1.4X -> risco 首先需要说明的是,这个壳被偷取的代码非常多,如果去找的话会比较麻烦,所以我们换一种另类的方法,不脱壳也可以使用资源修改器对程序 ...
- 由一篇博文做出的代码,不用Math.round()如何实现其功能
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- JAVA、android中常用的一些jar包的作用
正文: 这里主要介绍的是hibernate使用到的.jar Hibernate一共包括了23个jar包,令人眼花缭乱.本文将详细讲解Hibernate每个jar包的作用,便于你在应用中根据自己的需要进 ...
- window10下的solr6.1.0入门笔记之---安装部署
1.安装部署java1.6+ ,确保jre安装[安装步骤略] 安装后的环境为jdk1.8+ jre1.8+ 2.安装ant 下载:官网=>http://ant.apache.org/=> ...
- 痛苦之旅——安装Eric4
因为想做桌面程序,所以在学PyQt4, 顺便装了下Eric4,这Eric4装起来可不简单,活活花了一个星期..... 网上有很多装Eric4的教程,详细我就不说了,大概步骤是: 1.安装SIP (需要 ...
- 转:为什么在定义hashcode时要使用31这个数呢?
散列计算就是计算元素应该放在数组的哪个元素里.准确的说是放到哪个链表里面.按照Java的规则,如果你要想将一个对象放入HashMap中,你的对象的类必须提供hashcode方法,返回一个整数值.比如S ...
- C11简洁之道:tupe元祖
tuple元组是一个固定大小不同类型的值的集合,是泛化的std::pair.我们也可以把它当作一个通用的结构体来使用,不需要创建结构体有获取结构体特征,在某些情况可以取代结构体,使程序更简洁.直观. ...