簡體   English   中英

如何刪除選定行上的懸停效果?

[英]How to remove hover effect on selected row?

我將 .k-state-selected 更改為不同的顏色,效果很好。 但是,當我將鼠標懸停在所選行上時,懸停顏色為藍色。 我試過了

.k-grid tr:hover{ background:transparent; }

這適用於未選擇的行,但不適用於所選行。 基本上我需要刪除選定行上的懸停效果並且無法弄清楚

 $("#grid").kendoGrid({ columns: [{ field: "name" }, { field: "age" } ], dataSource: [{ name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 } ], selectable: "row" });
 .k-grid .k-state-selected { background: #ec971f; }
 <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.rtl.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.silver.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.mobile.all.min.css" /> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script> <div id="grid"></div>

嘗試一下:

 $("#grid").kendoGrid({ columns: [{ field: "name" }, { field: "age" } ], dataSource: [{ name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 } ], selectable: "row" });
 .k-grid .k-state-selected { background: #ec971f; } .k-grid .k-state-selected:hover { background: #ec971f!important; color:#000; }
 <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.common.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.rtl.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.silver.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.3.1023/styles/kendo.mobile.all.min.css" /> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script src="https://kendo.cdn.telerik.com/2019.3.1023/js/kendo.all.min.js"></script> <div id="grid"></div>

由於 CSS 特殊性規則, .k-grid tr:hover不起作用。 換句話說, .k-grid .k-state-selected.k-grid tr:hover更具體。

.k-grid .k-state-selected:hover應該適合你。

例子

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM