DecemberGuild
New Member
- Messages
- 107
- Reaction score
- 0
- Points
- 0
I'm using a script that doesn't seem to be working how I want it to.
I need the script to check the size of the scrollbars based on a DIV element on the page, and then return the size (this script is not mine).
I added another script to combine that with a CSS tag so that the script will parse the proper CSS tag based on the scrollbar width on the page.
I'm getting a problem. When I run the first script, which tests the DIV's scrollbar width, it erases the pages and replaces it with its results. So, instead of seeing the new CSS tag added near the top of my page, I'm seeing a page with nothing on it except that CSS tag.
Here is my page: [link]
Here is the script:
Here is the outcome of the script:
I sincerely thank you for any and all help.
I need the script to check the size of the scrollbars based on a DIV element on the page, and then return the size (this script is not mine).
I added another script to combine that with a CSS tag so that the script will parse the proper CSS tag based on the scrollbar width on the page.
I'm getting a problem. When I run the first script, which tests the DIV's scrollbar width, it erases the pages and replaces it with its results. So, instead of seeing the new CSS tag added near the top of my page, I'm seeing a page with nothing on it except that CSS tag.
Here is my page: [link]
Here is the script:
<script>
function getScrollerWidth() {
var scr = null;
var inn = null;
var wNoScroll = 0;
var wScroll = 0;
// Outer scrolling div
scr = document.createElement('div');
scr.style.position = 'absolute';
scr.style.top = '-1000px';
scr.style.left = '-1000px';
scr.style.width = '100px';
scr.style.height = '50px';
// Start with no scrollbar
scr.style.overflow = 'hidden';
// Inner content div
inn = document.createElement('div');
inn.style.width = '100%';
inn.style.height = '200px';
// Put the inner div in the scrolling div
scr.appendChild(inn);
// Append the scrolling div to the doc
document.body.appendChild(scr);
// Width of the inner div sans scrollbar
wNoScroll = inn.offsetWidth;
// Add the scrollbar
scr.style.overflow = 'scroll';
// Width of the inner div width scrollbar
wScroll = inn.offsetWidth;
// Remove the scrolling div from the doc
document.body.removeChild(
document.body.lastChild);
// Pixel width of the scroller
return (wNoScroll - wScroll);
}
</script>
<script>
function stylescroll() {
document.write("<style>#footerContainer { padding-right:" + getScrollerWidth() + "px; }</style>");
}
window.onload = stylescroll;
</script>
Here is the outcome of the script:
<style>#footerContainer { padding-right:17px; }</style>
I sincerely thank you for any and all help.
Last edited: