旋转滚动条按钮的图像答案

【问题标题】：Rotate the scrollbar button's image旋转滚动条按钮的图像
【发布时间】：2013-05-26 23:24:13
【问题描述】：

我想旋转滚动条按钮的图像，这是我的滚动条代码：http://fiddle.jshell.net/Hepxc/ 我想将 y 轴的第二个图像旋转 180 度，将 x 轴旋转 90 度。我试过这段代码，但没有用：

transform: rotate(10deg);
-moz-transform: rotate(10deg);
-webkit-transform: rotate(10deg);

【问题讨论】：

到底为什么要将-moz 样式应用于-webkit 规则的负载？
什么意思？如果我的 FIDDLE 代码有什么需要修复的地方，请告诉我，如果你说的是灰色区域中的代码，那不是我写的，我也不会使用它
您的小提琴中的图像不起作用，我指的是您在 startpost 中使用-moz-transform - 将 Mozilla Firefox 特定样式规则添加到仅 Webkit 的功能没有多大意义。
它应该工作得很好我不知道为什么它不工作

【解决方案1】：

执行transform: rotateX(XXdeg) rotateY(XXdeg);按特定轴旋转。
如果您想要 3D 效果，请给父对象一个“透视”，例如600 像素：perspective:600px;。如果没有对父元素的透视，您将看不到 3D 效果（如果您想要这种行为）。

【讨论】：

它不起作用 :( 我尝试添加你的两个代码但它不起作用。这是添加代码的新代码：::-webkit-scrollbar-button:vertical:increment { background-image: url(http://i.imgur.com/ygGobeC.png); background-repeat: no-repeat; transform: rotateX(XXdeg) rotateY(XXdeg); perspective:600px; }
请尝试获取它在小提琴网站上使用我的代码，我给出了 20 个答案的声誉.. :)
我不是浏览器特定 CSS 的朋友，而是设置了广泛的兼容性（因此不太了解特定于 webkit 的规则），但是，您可能会发现这个可自定义的滚动插件很有趣：@987654321 @更多例子见manos.malihu.gr/tuts/jquery_custom_scrollbar.html