DesktopHTMLViewer in Windows OS, hide scrollbars?

Hello,

I am using a DesktopHTMLViewer embedded in a window and ideally I would like to have that browser hide its scrollbars, particularly the vertical one, but I will take all/either.

I have tried various javascript calls with no sucess… the first three don’t seem to be generating errors, just not affecting the browser. The last one gets hung up on the “:”.

I am assuming CEF should be compatible with Chromium Javascript???

I have not tried other platforms as my immediate need is Windows.

Has anyone had success with this or other methods?

Regards,

Todd Fantz

XOJO 2024r3

document.body.scrollbar-width = ‘none’;
document.body.style.overflow = ‘hidden !important’;
document.body.style.overflow = ‘hidden’;
document.hide-scrollbar::webkit-scrollbar = ‘display:none’;

One way to get some clues is to display the Dev tools. Have the focus on the HTMLViewer, then hit F12. Look for errors in the page. At the bottom you have access to errors - you must switch to that section.

This is not really specific to Xojo, but assuming the target is using webkit (like macOS and edge-based windows webviews), this is what you need:

::-webkit-scrollbar {
    width: 0px;
    background: transparent;
}

::-webkit-scrollbar-corner {
  display: none;
  -webkit-appearance:none;
  background-color: transparent;
}

If you need to use javascript, you could also do:

const el = document.createElement('style')
el.textContent = `
  ::-webkit-scrollbar {
      width: 0px;
      background: transparent;
  }
  
  ::-webkit-scrollbar-corner {
    display: none;
    -webkit-appearance:none;
    background-color: transparent;
  }
`
document.head.appendChild(el)