Question

我正在使用jssor缩略图滚动条，几乎可以得到我想要的所有东西，但我最后还是坚持了。

所选缩略图图像上的边框，我希望所选缩略图上的边框与未选择的缩略图颜色不同。

使用皮肤01我已经在其下面制作了所有CSS的宽度和高度为70px，因为这可以解决一些边框的烦人问题，例如当您指定1px时，顶部和右边框为2px，但现在我想要当前选择的缩略图具有不同的颜色边框。

皮肤01上的哪个类是当前所选缩略图的CSS位？

 /* jssor slider thumbnail navigator skin 01 css */
 /*
 .jssort01 .p (normal)
 .jssort01 .p:hover   (normal mouseover)
 .jssort01 .p.pav     (active)
 .jssort01 .p.pdn     (mousedown)
 */

 .jssort01 {
 position: absolute;
 /* size of thumbnail navigator container */
 width: 233px;
 height: 90px;
 }

 .jssort01 .p {
 position: absolute;
 top: 0;
 left: 0;
 width: 72px;
 height: 72px;
 }

 .jssort01 .t {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 border: none;
 }

 .jssort01 .w {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 100%;
 height: 100%;
 }

 .jssort01 .c {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 70px;
 height: 70px;
 border: red 1px solid;
 box-sizing: content-box;
 background: url(../img/t01.png) -800px -800px no-repeat;
 _background: none;
 }

 .jssort01 .pav .c {
 top: 2px;
 _top: 0px;
 left: 2px;
 _left: 0px;
 width: 70px;
 height: 70px;
 border: red 0px solid;
 _border: red 1px solid;
 background-position: 50% 50%;
 }

 .jssort01 .p:hover .c {
 top: 0px;
 left: 0px;
 width: 70px;
 height: 70px;
 border: blue 1px solid;
 background-position: 50% 50%;
 }

 .jssort01 .p.pdn .c {
 background-position: 50% 50%;
 width: 70px;
 height: 70px;
 border: red 1px solid;
 }

 * html .jssort01 .c, * html .jssort01 .pdn .c, * html .jssort01 .pav .c {
 /* ie quirks mode adjust */
 width /**/: 72px;
 height /**/: 72px;
 }

我玩过上面所有边框设置都在改变颜色，测试颜色改变了边框px尺寸，但是我不知道上面的代码中有什么可以处理自动选择的缩略图上的边框。

在上面的CSS中，它将其列为提示

.jssort01 .p.pav（有效）

但实际代码中没有 .jssort01 .p.pav

感谢您的帮助。

Answer 1

不确定我使用正确的Jssor演示，但如果我正确，那么这里你想要的是什么：
.jssort01 .t { position: absolute; top: 0; left: 0; width: 70px; height: 70px; border: 1px solid white;  }

Answer 2

感谢答案 Henry Varro ，但它与CSS以及JS中的 $ Align 有关。

$ Align 现在位于 121

和皮肤css如下：

            .jssort01 .pav .c {
            width: 70px;
            height: 70px;
            border: blue 1px solid;
            background-position: 50% 50%;
        }

颜色仅用于测试，并且在集成到我的脚本中时会被更改

感谢您的帮助。

如果jssor团队编写了一个关于什么皮肤CSS元素改变了什么的教程，那将会有所帮助。

jssor活动缩略图边框

2 个答案: