问题标签 [zebra-striping]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1530 浏览

jquery - 更改 jqGrid 中 rownumber 值的 CSS

我已将jqGrid的属性更改为rownumbers:true. 因此它显示行号。现在我想改变它的CSS。我怎样才能做到这一点?

在此处输入图像描述

在上图中,记录的 CSS 改变了,但行号的 CSS 没有改变。现在我也想更改行号的 CSS。我怎样才能做到这一点?

0 投票
1 回答
984 浏览

css - 我怎样才能“斑马条纹”CSS 列?

假设我有以下标记:

以及以下 CSS(假设前缀):

我怎样才能“斑马条纹”奇数?这是我认为正确的小提琴(注意我使用 SCSS 作为我的 CSS)

0 投票
1 回答
208 浏览

jquery - 桌子分拣机-斑马剥离

我正在使用这个带斑马剥离的桌子分拣机。我正在使用下拉菜单选项进行排序。我有两个问题。

1)我有灰色和白色交替的行。但我有一些特殊的行总是灰色的。

假设如果是正常情况,我将有灰色、白色、灰色顺序。

现在假设上面的白色行是我正在谈论的特殊行。那么它将是灰色的。所以现在我们有三行灰色而不是灰色白色灰色。

有什么办法斑马小部件可以智能地注意到前一个是特殊行(总是灰色),它应该使当前行为白色。

0 投票
2 回答
2388 浏览

jquery - 集成 jQuery 表格排序器、斑马条纹和行突出显示

我已经尝试多次编写和重写,以保持简短,但包括“相关”背景。没有运气,所以我将给出当前情况并按要求回答问题。

我有两个问题,所以我把一个放在这篇文章中,另一个放在上一篇文章中。

我有一个动态表,它被硬编码到 tbody 标签。tbody 内的行由 AJAX 调用动态生成。

我需要能够(1)对表格进行斑马条纹;(2)对表格进行排序;(3) 突出显示当前悬停的行。我可以用 CSS 做斑马条纹,没问题。我也可以用 CSS 完成高亮行功能(在某种程度上)。

但是当实现表排序时(使用 jQuery 的表排序器),行不会“重新渲染”样式,所以我最终会得到浅灰色行和白色行的团块,而不是斑马条纹。

另外,当以这种方式接近时,行突出显示仅适用于白色行(未应用 CSS 类)。

我以为我上周找到了一些可以提供解决方案的文章,但我今天似乎找不到它们。我在网上找到的所有内容在实现或功能上都有一些不可接受的故障。

这是当前的代码:

我得到的错误出现在指定的代码行上。错误是:

SyntaxError: missing ) 在参数列表之后

0 投票
3 回答
1790 浏览

javascript - Zebra 条带化到一个表列

我有一个表,它对表行使用表排序器和斑马条纹。我想在其中一个表 COLUMNS 中添加斑马条纹,以稍微强调一下。像这样:

我想要做什么的总体思路

0 投票
1 回答
2285 浏览

jquery - 带有斑马条纹的表格行和列突出显示

我采用了 Chris Coyier 表格行和 col 突出显示代码并添加了斑马条纹。我可以使行突出显示,但启用斑马条纹时 col 停止突出显示。

如果您取消注释 jQuery 的第一 2 行以显示斑马条纹,您将看到我在上面概述的问题。

不完全确定为什么这些是冲突的。

任何帮助表示赞赏。

很抱歉所有代码都在这里,但似乎我无法使用 jsFiddle 向您展示,你知道,这是向您展示代码工作的非常有用的服务,因此您可以编辑和摆弄它。

CSS

jQuery

HTML

0 投票
1 回答
315 浏览

jquery-selectors - 深度嵌套,任意长度的定义列表,Jquery 中的斑马条纹

我有一个页面,其中标记包括与任何 DT 关联的随机深度和随机数 DD 的嵌套定义列表。因此:

我需要:

  1. zebra 将 DT/DD 组相互条纹化,并且
  2. 为遇到的每个嵌套列表重新开始偶数/奇数序列。

    • 由于额外的 DD,使用 :even 和 :odd 将不起作用。
    • 我尝试使用 each 循环,如下所示:http://jsfiddle.net/XJ9j4/,它修复了 A 但忽略了 B。即将第一个孩子 dt/dd 组合的背景颜色与第一个父母进行比较,并考虑返回应该是蓝色而不是绿色的父列表。

想法?

0 投票
2 回答
1299 浏览

jquery - 斑马剥离在 IE8 中不起作用

我编写了以下 jquery 以将斑马剥离应用于表中的某一行。这在 Chrome 和 Firefox 中运行良好,但在 IE8 中不起作用。W

这是HTML

0 投票
2 回答
1944 浏览

css - 我的“斑马条纹”表不打印条纹

我有一个不是“打印机友好”的页面,所以我的用户要求选择打印出一个显示搜索结果的表格。我创建了一个打印机友好页面,该页面通过一个按钮打开并从原始表格中填充。新页面根据需要显示原始表格中的“斑马条纹”。但是当我拉起打印预览(浏览器菜单>文件>打印预览)时,条纹消失了。显示字体更改。所有其他样式更改都会显示出来。但是影响条纹的 TR 阴影不会转换。

这是我的代码:

正如我希望的那样,代码非常简单明了。我只是不明白为什么印刷版上没有出现条纹。

0 投票
0 回答
432 浏览

javascript - Zebra 对 html 表进行条带化处理

假设我有两张桌子,一张有白色行,一张有所有绿色行。

我目前有针对白色背景执行此操作的 stripeTable 代码:

但我想要一个使奇数行更暗的函数,这样如果基础背景不是白色,它仍然只是改变“一些 RGB”值“更暗”,这样我就不必选择一个不同的颜色。

关于如何快速做到这一点的任何想法?我正在考虑读取背景的 RGB 值,然后为它计算一个更暗的值,但我对如何做到这一点一无所知。

更新:

jquery-color解决方案的问题 是我需要提供当前的 bg 颜色,因为可以在 td/th 级别和 tr 级别和 TABLE 级别以及上面的任何其他元素上设置我真的不能确定我的桌子将以颜色 X 作为背景。至少在使用 $(this).css('background-color') 时不会,(如果背景颜色未在我应用条纹颜色的 CSS 级别定义,则返回 undefined。

以jQuery 和颜色计算中介绍的方式使用 jsColors getRGB 函数

代码现在只适用于白色背景:

具体更新的问题,我需要了解元素的实际背景颜色 hex/rgb,即使它没有设置在那个 CSS LEVEL