disable mouseover row highlight for rows in Grid zk 9.5

Question

asked 2021-04-25 20:49:59 +0800

zkdev4
32 ● 2

How can I disable mouseover row highlighting for rows in Grid/listbox in zk 9.5

Accepted Answer

1

answered 2021-04-26 14:24:19 +0800

cor3000
6280 ● 2 ● 7

the hover highlighting is a basic CSS effect, so there's no 'switch' to 'disable'. Instead you can override the CSS.

e.g. globally for all grids:

.z-row:hover>.z-row-inner, 
.z-row:hover>.z-cell {
    background-color: #ffffff;
}

or per instance by assigning a custom sclass:

<grid sclass="mygrid">...

prefix the style rule with the my .mygrid selector

.mygrid .z-row:hover>.z-row-inner, 
.mygrid .z-row:hover>.z-cell {
    background-color: #ffffff;
}

Here a runnable example of the per instance case:

https://zkfiddle.org/sample/1alnfa0/1-grid-disable-hover-color

link publish delete flag offensive edit

Comments

Thanks for the selectors! I've tried it but it produced a secondary side effect : We have labels and textboxes in a grid row and now the label text disappears. Is there any CCS magic to avoid that ? Do we have to write an extra color change selector for the label foreground ?

Thanks again!

zkdev4 ( 2021-04-27 19:55:26 +0800 )edit

I think this doesn't require "magic" just some careful analysis of what's happening and decide what to do next. please update the zkfiddle example (and provide an updated link - I'll increase your karma) to illustrate your case, then I can provide updated styles

cor3000 ( 2021-04-28 11:04:39 +0800 )edit

Sorry for my late reply, I've updated the fiddle with sample code. We are using Atlantic theme and only Sapphire matches our side effects. It is clearly theme based but this is clients requirement so we cannot change it.

zkdev4 ( 2021-05-11 16:55:26 +0800 )edit

how about this? https://zkfiddle.org/sample/1alnfa0/4-grid-disable-hover-color

cor3000 ( 2021-05-11 22:21:21 +0800 )edit

Thanks it works!!

zkdev4 ( 2021-05-19 23:07:56 +0800 )edit

CORE FRAMEWORK

FEATURED COMPONENTS

TOOLS

EXPLORE ZK

RESOURCES

LEARN ZK

RESOURCES

GET HELP

RESOURCES

MORE ABOUT ZK

MORE ABOUT ZK

disable mouseover row highlight for rows in Grid zk 9.5

1 Answer

Comments

Question tools

Stats

Related questions