JavaScript for IE and FF to detect a users scrollbar width in pixels for advanced webpage development.
1<?php 2function getScrollbarWidth() { 3 var sBarWidth = 0; 4 var scr = null; 5 var inn = null; 6 7 if (is_ie) { 8 // create form 9 scr = document.createElement('form');1011 // move form off screen so no one can see it12 scr.style.position = 'absolute';13 scr.style.top = '-1000px';14 scr.style.left = '-1000px';1516 // create a text area17 inn = document.createElement('textarea');1819 //set id so we can grab it later20 inn.setAttribute('id', 'ta');2122 // add textarea to form23 scr.appendChild(inn);2425 // add the element to the document26 document.getElementsByTagName("body")[0].appendChild(scr);2728 // grab the text area by id29 var tarea = fetch_object('ta');3031 // turn scroll bars off32 tarea.wrap = 'off';3334 // get height35 sBarWidth = tarea.offsetHeight;3637 // turn scroll bars on38 tarea.wrap = 'soft';3940 // get difference41 sBarWidth -= tarea.offsetHeight;42 } else {43 var wNoScroll = 0;44 var wScroll = 0;4546 // Outer scrolling div47 scr = document.createElement('div');4849 // move form off screen so no one can see it50 scr.style.position = 'absolute';51 scr.style.top = '-1000px';52 scr.style.left = '-1000px';5354 // set binding height and width55 scr.style.width = '100px';56 scr.style.height = '50px';5758 // Start with no scrollbar59 scr.style.overflow = 'hidden';6061 // Inner content div62 inn = document.createElement('div');63 inn.style.width = '100%';64 inn.style.height = '200px';6566 // Put the inner div in the scrolling div67 scr.appendChild(inn);6869 // Append the scrolling div to the doc70 document.body.appendChild(scr);7172 // Width of the inner div sans scrollbar73 wNoScroll = inn.offsetWidth;7475 // Add the scrollbar76 scr.style.overflow = 'auto';7778 // Width of the inner div width scrollbar79 wScroll = inn.offsetWidth;8081 // Pixel width of the scrolbar82 sBarWidth = (wNoScroll - wScroll);83 }8485 // Remove the scrolling div from the doc86 document.body.removeChild(document.body.lastChild);8788 return sBarWidth;89}