Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head><title></title>
- <script src="jquery-3.1.1.min.js"></script>
- <script src="jquery.sizes.js"></script>
- </head>
- <body style='
- margin-top:10px;
- border-top-width:11px;
- padding-top:12px;
- border-style:solid;border-color:cyan;
- padding-bottom:13px;
- border-bottom-width:14px;
- margin-bottom:15px;
- '>
- <div id='outer' style='background-color:lime;height:100%;
- margin-top:16px;
- border-top-width:17px;
- padding-top:18px;
- border-style:solid;border-color:red;
- padding-bottom:19px;
- border-bottom-width:20px;
- margin-bottom:21px;
- '
- >
- <p>line 1</p>
- <div id='inner' style='background-color:pink;
- margin-top:22px;
- border-top-width:23px;
- padding-top:24px;
- border-style:solid;border-color:blue;
- padding-bottom:25px;
- border-bottom-width:26px;
- margin-bottom:27px;
- '>
- <p>line 2</p>
- <p>line 3</p>
- <p id='debug'></p>
- </div>
- </div>
- <script>
- console.log('------------------------------------------------------------------');
- /*global $*/
- "use strict";
- $( window ).resize( function()
- {
- var x = 0 +
- // + $('#inner').margin().top
- + $('#inner').offset().top
- + $('#inner').border().top
- + $('#inner').padding().top
- // inner content, inside hieght
- + $('#inner').padding().bottom
- + $('#inner').border().bottom
- + $('#inner').margin().bottom
- + $('#outer').padding().bottom
- + $('#outer').border().bottom
- + $('#outer').margin().bottom
- + $('body').padding().bottom
- + $('body').border().bottom
- + $('body').margin().bottom;
- var h = $(window).height() - x;
- $('#inner')[0].style.height = h+'px';
- /* Trace */ if(false)
- {
- var newbot = $('body').offset().top +
- i.offset().top +
- i.outerHeight(true) ;
- D(h +'-'+ newbot +" = "+ (h - newbot));
- }
- }
- );
- $( window ).resize();
- </script>
- </BODY>
- </HTML>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement