Home > Web Front-end > JS Tutorial > jquery dynamically resizes div so that its width is always the browser width_jquery

jquery dynamically resizes div so that its width is always the browser width_jquery

WBOY
Release: 2016-05-16 16:45:58
Original
1087 people have browsed it

Sometimes we need to set a div whose width is the entire browser width. Of course, we can use relative layout to do this, but we can also use jquery to achieve it.

Copy code The code is as follows:




jquery test






<script> <br>var browser_width = $(document.body).width(); <br>$("div.show").css("width",browser_width ); <br>$(window).resize(function() { <br>browser_width = $(document.body).width(); <br>$("div.show").css("width", browser_width); <br>}); <br></script>


We use $(document.body).width() to get the browser content When loading the page, we initialize the width of the div to the width of the browser page, and then whenever the browser is resized, the resize function will be triggered. At this time, we adjust the width of the div again.
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template