Listbox hover
Moderators: FranklinDM, Lootyhoof
Listbox hover
Is there any way to make a listcell in a listbox change its appearance when hovered? I have tried searching, but cannot find anything about listcells. I do not care if it is the label or the checkbox that changes.
Re: Listbox hover
Should be possible with the right CSS userstyle, right selector, etc? Which listcell in which listbox... Pale Moon or an extension?
Re: Listbox hover
It should work for any listbox in the browser's interface. I was experimenting with adding ":hover" to the element for a listcell check, but it did not work. It evidently does not work the same way as with normal checkboxes.
Re: Listbox hover
Curious as to why adding ':hover' not working... and after some research online... rather suspect that the 'Select/Option' box elements may well be rendered by the OS... so wouldn't be able to change their style using CSS? You get what the system provides.
Re: Listbox hover
You can't stype <option>s because those indeed are styled depending on the OS and often drawn by using OS widgets.
Here's a quick run-down of form widgets grouped by styling flexibility:
Easy to style:
Here's a quick run-down of form widgets grouped by styling flexibility:
Easy to style:
- <form>
- <fieldset> and <legend>
- Single-line text <input>s (e.g. type text, url, email), except for <input type="search">.
- Multi-line <textarea>
- Buttons (both <input> and <button>)
- <label>
- <output>
- <select> (caveat: only the in-form select box can be styled. if you use considerably deviating metrics like large padding etc., it may look really bad when popping open the OS widget when dropping down the list)
- Checkboxes and radio buttons
- <input type="search">
- <input type="color">
- Date-related controls such as <input type="datetime-local">
- <input type="range">
- <input type="file">
- Elements involved in creating dropdown widgets, including <option>, <optgroup> and <datalist>.
- <progress> and <meter>
"Sometimes, the best way to get what you want is to be a good person." -- Louis Rossmann
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
-
- Moonbather
- Posts: 50
- Joined: 2022-12-06, 17:44
Re: Listbox hover
Is the inability to style "listcell" on hover related to system styles?
As far as I see, the problem is that you can't get the hover event on listcell, it only triggers on listitem (and listitem is styled normally by :hover)
Even in the test example from here (as well as in some extensions that use xul:listbox) you can't select a cell, not a row.
And according to this, the listcell simply does not have the ability to "select"...
As far as I see, the problem is that you can't get the hover event on listcell, it only triggers on listitem (and listitem is styled normally by :hover)
Even in the test example from here (as well as in some extensions that use xul:listbox) you can't select a cell, not a row.
And according to this, the listcell simply does not have the ability to "select"...
I am sorry for the use of auto-translator to post
Re: Listbox hover
listcell is an internal and display specific. it's OS dependent and not addressable as html.
"Sometimes, the best way to get what you want is to be a good person." -- Louis Rossmann
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
Re: Listbox hover
If I get you right...
hover style for userChrome.css:
To set the color, you need to find another selector, just write here color: ... does not work. dig into the file chrome://global/skin/tree.css
hover style for userChrome.css:
Code: Select all
treechildren:not(.autocomplete-treebody)::-moz-tree-row(hover) {
background-image: -moz-linear-gradient( rgba(0,255,169,0.8), rgba(0,213,127, 0.8) ) !important;
}
Re: Listbox hover
Note that would only work for us and only as long as our internal addressing of XUL styling doesn't change. It's certainly not portable (you're editing chrome styling, not content styling)
"Sometimes, the best way to get what you want is to be a good person." -- Louis Rossmann
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite
Re: Listbox hover
It is possible to change the whole background of a listcell with hover, since Walnutty does that. I guess I have to settle for that.
Re: Listbox hover
Goodydino you are just a moron. soo_fkn_sorry dont be like this.
You could not initially describe, what and where you want to change?
А ты не мог изначально описать, что и где ты хочешь изменить?
If you need changes in the skin "Walnutty", then, you must change the skin yourself or ask the author to change it, at your request.
Если тебе нужны какие-либо правки в "шкурке", значит ты должен сам разобраться как там что и зачем, или попросить автора изменить "шкурку" по твоему запросу.
ok.Skin "Walnutty" does the same thing, reassigns 'treechildren'. All styles placed in .\walnutty-1.8.1.xpi\chrome\global\tree.css.
etc.
That's the way!
You could not initially describe, what and where you want to change?
А ты не мог изначально описать, что и где ты хочешь изменить?
If you need changes in the skin "Walnutty", then, you must change the skin yourself or ask the author to change it, at your request.
Если тебе нужны какие-либо правки в "шкурке", значит ты должен сам разобраться как там что и зачем, или попросить автора изменить "шкурку" по твоему запросу.
ok.Skin "Walnutty" does the same thing, reassigns 'treechildren'. All styles placed in .\walnutty-1.8.1.xpi\chrome\global\tree.css.
Code: Select all
treechildren::-moz-tree-row(hover) {
background-image:url(chrome://global/skin/hout.png)
}
treechildren::-moz-tree-row(selected) {
background-image:url(chrome://global/skin/hout-hover.png)
}
treechildren::-moz-tree-row(selected,focus) {
background-image:url(chrome://global/skin/hout-active.png)
}
treechildren::-moz-tree-row(current,focus) {
border:1px dotted #893B00
}
That's the way!
Re: Listbox hover
No, Walnutty already does a change which I found usable. It was not exactly what I wanted but it will do. I copied a line from listbox.css from there and added that line to the same file in the other themes.jars_ wrote: ↑2023-05-17, 21:09Goodydino you are just a moron. soo_fkn_sorry dont be like this.
You could not initially describe, what and where you want to change?
А ты не мог изначально описать, что и где ты хочешь изменить?
If you need changes in the skin "Walnutty", then, you must change the skin yourself or ask the author to change it, at your request.
Если тебе нужны какие-либо правки в "шкурке", значит ты должен сам разобраться как там что и зачем, или попросить автора изменить "шкурку" по твоему запросу.