css3 – 内容滚动条

我想制作透明的滚动条,它应该放在带有内容的div上.只有css和webkit浏览器.
它必须看起来像 example.我的 code.问题是滚动条将内容移动到左侧.如何让它看起来像在例子中？谢谢你的回复.

div{
  width:410px;
  height:100px;
  overflow-y:scroll;
  border:1px solid green;
  position:relative;
}

::-webkit-scrollbar{
  width:20px;
  position:absolute;
  right:20px;
  z-index:100;
} 

::-webkit-scrollbar-thumb{
  background-color:rgba(0,1);
  border-right:10px solid white;
}  

解决方法

这与示例非常相似.

::-webkit-scrollbar{
    width:7px;
} 

::-webkit-scrollbar-thumb{
    background-color: rgba(0,0.5);
    border-radius: 3px;
    border: 1px solid #fff;
}

否则你必须使用iscroll plugin