Excellent! Thank you. I’ve been killing myself trying to figure out how to get rid of that. I didn’t want to bother you.
Now just to get my font colors and sizes changed. I will try to do that myself before asking you guys for more help! 
1 Like
@Anthony_G_Cyphers Every time I go to type you’ve already beat me.
To add on to Anthony’s CSS you can hide all scrollbars like this:
::-webkit-scrollbar {
width: 0px;
background: transparent; /* make scrollbar transparent */
}
Just add it to the bottom of Anthony’s CSS.
In case your schedule data is bigger than the listbox.
1 Like
I think, there will be a very happy Jon sitting on the couch tonight, and a Jon who learned a lot of CSS in the past few hours 
1 Like
Cool. Thanks. I’ll keep that in mind if I need it. This is for a signage application where a Digital Signage player will display the generated page from the web app and display it on a TV screen. It’s to display a schedule of events at the facility. I may need to scroll the listbox via a timer if there’s a lot of events. So far that hasn’t been an issue - I think I should be able to get all the events on in one screen but who knows…
I did figure out how to change the text color and size. So that’s working too!
1 Like
I am getting flashbacks. I’ve done something similar for a school once. The css I gave just hides the scrollbar. It’s still fully functioning.
I just really hate the default scrollbar. It’s usually one of the first things I change.
::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
background: rgba(73, 162, 98);
}
2 Likes
In case you need it, could be easily modified to the WebListBox:
3 Likes
These are so much fun! I just discovered that using:
me.ColumnWidths
in the Opening event doesn’t work. But if you set ColumnWidths in the field in the IDE - that does work.
And I tell you I’m like susprised at how poorly things are operating in Web 2.
I have tried to scale my background image and draw it in a canvas. It never draws. I then tried to put it in an WebImageViewer but that has a static image and doesn’t resize as the viewer is resized. So then in the resized event of the window, I tried drawing a picture in a picture object with the proper size of the window and then assigning that to the image viewer. Nope. That doesn’t work either. I thought Web1.0 was bad with canvases and all. This seems to be a step backwards.
[Edit] And Update…
So if I manually resize the ImageViewer in the page’s resized event then it seems like it works. However, I have the image viewer locked on all four edges so when the page expands the viewer should. But it doesn’t seem to work…
Hey all,
I am re-opening this thread 3 years later. My problem is that I somehow lost the source code to the web app I created that displayed the listbox (yet I have the compiled version). How that happened, I don’t know. So now I need to make some changes to the app which is forcing me to start over and re-invent the wheel again!
So fast forward 3 years and it looks like Xojo has improved a LOT in its flexibility on adding styles to web controls. That’s terrific! Yay. But I am seeing a new issue now with the WebListbox. The transparency isn’t completely transparent. I’m using @Anthony_G_Cyphers code above, I’ve tried CSS commands, Xojo’s WebStyle objects, etc. All give the same result.
This is what is showing in the picture below. I’ve shifted the blue background image so you can see, but the “transparent” listbox still has some background opacity to it:
See how the background of the row is a light gray when shown on white? It’s harder to see it on the blue, but you can see it.
Previously, the code provided cleared the background. But now it doesn’t. I’m sure some things have changed in the last 3 years. I’m tempted to find a copy of Xojo 2021 and see what the code does on that…
Thoughts?
Bootstrap changed from 4.x to 5.x
Datatables (the code the Weblistboxes are based on) also updated
So yes, a lot of updates that will need code changes.
Obviously, it’s different. But as I posted, I am asking for help with the fact that setting the background of a listbox to transparent does not make it transparent. That’s my issue right now - transparency is not transparent.
If you provide a sample project that reproduce the screenshot you posted, I’m sure someone will review the new CSS used on the page to see what is needed to clear the opacity in ‘Hello World!’
I can do that. It’s the alternating rows of the listbox. That appears to be the issue. I’ll see if I can post up a sample project later today.
OK. Here’s my example project. I set a blue background. I want all the text to be white (Listbox headers are black - haven’t figured those out yet). I don’t want any alternating row shading between the rows. I don’t want scroll bars.
@Jon_Ogden - did you mean to save your example in the Xojo binary project format? You’ve got a Xojo project file shared with none of the other project files. FYI.
1 Like
The project cannot be opened without the external files. You need to zip up all the resources needed along with the project file.
1 Like
Yes I meant to do that…
OK. Let’s try this. Sorry about sending the wrong type of file, etc. I was doing it from a hotel room yesterday and was trying to get it out as quickly as possible…
Thanks,
Jon
I haven’t loaded your project, just downloaded it, but:
The bootstrap you include in your example is version 4.6.0.
Newer Xojo needs bootstrap version 5.3 or so.
Did you download that bootstrap from somewhere? Maybe you can get a newer version from the same place.
I don’t know where I got that from - it was 3 years ago. However, I found that bootstrap didn’t do much or anything (if I remember right) for the web listbox.
I don’t really care about the bootstrap theme if I can just accomplish it with the CSS code in the HTML Header of the app or in Style properties…