When I hide my div that is the parent to my grid div, showing it again make this horizontal scroll bar appear. The bar is just a blank scroll bar with no scroller.
Hello seang,
Can you provide more info (or sample) of your grid configuration, because I'm unable to reproduce this issue.
Best regards,Martin PavlovInfragistics, Inc.
I'll try to add bits of the code as this project is rather large. Let me know what code may be more relevant to you.
When I do this.
$( content ).children().hide();
my grid is hidden, then I do this its back but with a blank scroll bar.
$( content ).children()show();
This is how I make my divs.
var win = document.createElement( 'div' ); win.setAttribute( 'id', 'myWindow' + id ); win.setAttribute( 'data-minwidth', '75' ); win.setAttribute( 'data-minheight', '50' ); win.setAttribute( 'class', 'box_flat' + theme + ' message' ); win.setAttribute( 'style', 'z-index:' + id ); win.onmousedown = function () { _iUI.swapDepthToFront( win ); } var bar = document.createElement( 'div' ); bar.setAttribute( 'id', 'myBar' + id ); bar.setAttribute( 'class', 'handle bar_' + theme ); bar.ondblclick = function () { _iUI.fullScreenToggle( id ); } bar.innerHTML = '<h2 class="handle bar_"+theme >' + name + '</h2>'; win.appendChild( bar ); _currentWindowElementActive = win; var content = document.createElement( 'div' ); content.setAttribute( 'id', 'myContent' + id ) content.setAttribute( 'class', 'contents' ) win.appendChild( content ); //tab pages var headerTXT = document.createElement( 'div' );//grid headerTXT.setAttribute( 'id', 'gridLayer' + id ); var transform = 'rotate(90deg) translate( 0px,' + ( -10 + rowHeader.visualLengthWidth() * .55 ) + 'px )';// 55 Works well var style = '-webkit-transform:' + transform + '; -moz-transform:' + transform + '; -o-transform:' + transform +";"; headerTXT.innerHTML = "<font size='4' color='black'>" + header + "</font><br><table><tr><td width='20px' > <label style='" + style + "' class='rotate' id='rowHeader" + id + "' > " + "<font size='4' color='black'>" + rowHeader + "</strong></lable> </td><td>" + "<div id='myDiv" + id + "' />" + "</td><td width='15px'></td></tr><tr height='20px'></tr></table>"; content.appendChild( headerTXT ); var infoTxt = document.createElement( 'div' );//info infoTxt.setAttribute( 'id', 'infoLayer' + id ); infoTxt.innerHTML = ""; if ( minXnorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > Minimum Value: <span style='color:red';>" + minXnorm + "</p>"; if ( minYnorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > Maximum Value: <span style='color:red';>" + minYnorm + "</p>"; if ( maxXnorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > Minimum Value: <span style='color:red';>" + maxXnorm + "</p>"; if ( maxXnorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > Maximum Value: <span style='color:red';>" + maxYnorm + "</p>"; if ( Xnorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > Y Normalizer: " + Xnorm + " </p>"; if ( Ynorm ) infoTxt.innerHTML += "<p style='color:black ;text-align: left;' > X Normalizer: " + Ynorm + " </p>"; if ( header ) infoTxt.innerHTML += "<p style='color:blue ;text-align: left;' > INFO: n/a </p>"; $( infoTxt ).hide(); content.appendChild( infoTxt );
...
attached is a screen shot.