jquery动态调整div大小使其宽度始终为浏览器宽度
需要设置宽度为整个浏览器宽度的div，当然我们可以使用相对布局的方式做到这一点，下面是具体实现，大家可以参考下
有时候我们需要设置宽度为整个浏览器宽度的div，当然我们可以使用相对布局的方式做到这一点，不过我们也可以用jquery来实现。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery test</title>
<script src="jquery-1.11.1.min.js"></script>
<style type="text/css">
.show
{
width: 500px;
height: 50px;
background-color: red;
}
</style>
</head>
<body>
<div class="show"></div>
<script>
var browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
$(window).resize(function() {
browser_width = $(document.body).width();
$("div.show").css("width",browser_width);
});
</script>
</html>
我们使用$(document.body).width()获取浏览器内容的宽度，在加载页面的时候我们初始化该div的宽度为浏览器页面的宽度，然后每当浏览器大小调整的时候，都会触发resize函数，此时我们再次对该div的宽度进行调整。
jquery动态调整div大小使其宽度始终为浏览器宽度的更多相关文章
- jquery入门 动态调整div大小，使其宽度始终为浏览器宽度
有时候我们需要设置宽度为整个浏览器宽度的div,当然我们可以使用相对布局的方式做到这一点,不过我们也可以用jquery来实现. <!doctype html> <html> & ...
- jquery动态改变div宽度和高度
效果体验:http://keleyi.com/keleyi/phtml/jquery/23.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD X ...
- CSS3 resize属性 调整div大小
resize 用户可调整div大小 IE不支持 none 不可调整元素尺寸 both 可调整宽度高度 horizontal 可调整宽度 vertical 可调整高度 注意:如果属性生效,必须设置元素 ...
- 算法(第四版)学习笔记之java实现可以动态调整数组大小的栈
下压(LIFO)栈:可以动态调整数组大小的实现 import java.util.Iterator; public class ResizingArrayStack<Item> imple ...
- iOS7动态调整文字大小
iOS7添加了动态调整文字的大小,app可以通过接受通知的方式进行设置 iOS 7 introduces Dynamic Type, which makes it easy to display gr ...
- jquery 拖动改变div大小
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js判断浏览器的类型，动态调整div布局
最近写页面用bootstrap和amazeUi然后发现自己写的部分和两个框架做重合时,页面大小变化后有的元素变得很乱,很乱无奈只好用js判断 window.onscroll = function sc ...
- 拖拽调整Div大小
今天写了一天这个jquery插件: 可以实现对div进行拖拽来调整大小的功能. (function ($) { $.fn.dragDivResize = function () { var delta ...
- JavaScript鼠标拖动div且可调整div大小
http://www.softwhy.com/article-5502-1.html <!DOCTYPE html> <html> <head> <meta ...
随机推荐
- 算法笔记_075:蓝桥杯练习 最短路（Java）
目录 1 问题描述 2 解决方案 2.1 floyd算法解决 2.2 spfa算法解决 1 问题描述 问题描述 给定一个n个顶点,m条边的有向图(其中某些边权可能为负,但保证没有负环).请你计算从 ...
- Unity UI代码自动生成
最近在做新项目跟同事讨论UI制作方案, 这里就说下根据节点来生成UI代码, 这个工具可以根据预设生成一个分布类.目前组件还不是很完善, 自己使用需要修改部分代码 组件功能如下: 1. 自动设置引用 ...
- nginx做正向代理（Centos7，支持http和https）
默认的情况下,使用nginx做正向代理可以解析http请求, 对于诸如baidu.com这样的https请求,nginx默认并不支持,不过我们可以借助第三方模块来实现. 1.先说默认情况下的代理配置 ...
- Hibernate 使用log4j输出日志
jar包不能少:F:\jars\slf4j-api-1.7.5.jar F:\strutsWsold\slf4j-1.7.5\slf4j-1.7.5\slf4j-log4j12-1.7.5.j ...
- 忽略警告注解@SuppressWarnings详解
简介:java.lang.SuppressWarnings是J2SE 5.0中标准的Annotation之一.可以标注在类.字段.方法.参数.构造方法,以及局部变量上. 作用:告诉编译器忽略指定的警告 ...
- Git-在一个电脑上同时使用两个Git的账号
前言 又需要登录公司的账号,又想在电脑上使用自己的账号. 实现 首先是git config方面的设置,要取消掉原本对于git账号的全局设置. git config --global --unset u ...
- 0基础的小白怎么学习Java？
自身零基础,那么我们应该先学好Java,首先我们来了解下Java的特性: Java语言是简单的 Java语言的语法与C语言和C++语言很接近,使得大多数程序员很容易学习和使用Java.另一方面,Jav ...
- 【转】C# 视频监控系列（12）：H264播放器——播放录像文件
原文地址:http://www.cnblogs.com/over140/archive/2009/03/23/1419643.html?spm=5176.100239.blogcont51182.16 ...
- Mysql删除重复数据保留最小的id
在网上查找删除重复数据保留id最小的数据,方法如下: DELETE FROM people WHERE peopleName IN ( SELECT peopleName FROM people GR ...
- SSDB（网络LevelDB）-- 实际遇到的问题
简介 SSDB -- 支持网络的LevelDB 站点:https://github.com/ideawu/ssdb 我实际使用了SSDB支持网络+持久化特性,完成了一个集群 1.句柄数 ulimit ...