Apple Like Javascript Slider
I need a slider like this one
http://itunes.apple.com/us/app/sparrow/id开发者_运维知识库417250177?mt=12 (on Screenshots)
http://storymatters.com/showcase/there-is-an-app-for-that#slideshowWrap
Ideas?
That's just a custom scroll bar that works on webkit browsers: http://css-tricks.com/examples/WebKitScrollbars/ Here's an example
html {
overflow: auto;
}
body {
position: absolute;
top: 20px;
left: 20px;
bottom: 20px;
right: 20px;
padding: 30px;
overflow-y: scroll;
overflow-x: hidden;
}
/* Let's get this party started */
::-webkit-scrollbar {
width: 12px;
}
/* Track */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius: 10px;
border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255,0,0,0.8);
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,0.4);
}
IE has a way to style scrollbars too, not as customizable though...
body {
scrollbar-arrow-color:#ffffff;
scrollbar-base-color: #ffffff;
scrollbar-dark-shadow-color:#ffffff;
scrollbar-track-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-shadow-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3d-light-color:#ffffff;
}
So, if you want this to work across browsers, you're out of luck. The only way to do it is to write your own custom html for a scroll bar with the divs set to overflow: hidden
精彩评论