1
0
Fork 0

Scrolling fixes

This commit is contained in:
magnolia-fan 2011-06-28 03:25:27 +04:00
parent 18b2b910ae
commit 391288d861
3 changed files with 63 additions and 42 deletions

View File

@ -188,6 +188,7 @@
this.handleArrows = this.container.find('.scrollbar-handle-up, .scrollbar-handle-down');
this.handleArrowUp = this.container.find('.scrollbar-handle-up');
this.handleArrowDown = this.container.find('.scrollbar-handle-down');
this.pane_last_top = 0;
// set some default CSS attributes (may be overwritten by CSS definitions in an external CSS file)
this.pane.defaultCss({
@ -388,7 +389,11 @@
// derive position of content from position of handle
this.pane.top = -1 * this.props.handleContentRatio * this.handle.top;
// var distance = Math.round(Math.abs(this.pane_last_top - this.pane.top));
// $(this.pane[0]).stop().animate({top: this.pane.top}, 10 * distance / Math.sqrt(distance));
this.pane[0].style.top = this.pane.top + 'px';
this.pane_last_top = this.pane.top;
},
@ -398,7 +403,7 @@
onMouseWheel: function(ev, delta){
// calculate new handle position
this.handle.top -= delta*5; // awfull fix
this.handle.top -= delta*15; // awfull fix
this.setHandlePosition();
this.setContentPosition();

View File

@ -22,7 +22,9 @@
}
/* Scrollbars */
.css-scrollbar {
.data-container {
.scrollbar-pane {
margin-right: 8px;
}
@ -34,42 +36,49 @@
.scrollbar-handle {
width: 8px;
}
&.data-container {
.scrollbar-handle-container {
background-color: #FFF;
}
.scrollbar-handle {
background-color: #CCC;
&:hover {
background-color: #999;
}
&.move {
background-color: #AAA;
}
}
.scrollbar-handle-container {
background-color: #FFF;
}
.scrollbar-handle {
background-color: #CCC;
&.player-container {
.scrollbar-handle-container {
background-color: #222;
&:hover {
background-color: #999;
}
.scrollbar-handle {
background-color: #444;
&:hover {
background-color: #666;
}
&.move {
background-color: #888;
}
&.move {
background-color: #AAA;
}
}
}
.player-container {
.scrollbar-pane {
margin-right: 8px;
}
.scrollbar-handle-container {
width: 8px;
}
.scrollbar-handle {
width: 8px;
}
.scrollbar-handle-container {
background-color: #222;
}
.scrollbar-handle {
background-color: #444;
&:hover {
background-color: #666;
}
&.move {
background-color: #888;
}
}
}
.error_page {
position: relative;

View File

@ -18,27 +18,34 @@
border-color: #DDD; }
/* Scrollbars */
.css-scrollbar .scrollbar-pane {
.data-container .scrollbar-pane {
margin-right: 8px; }
.css-scrollbar .scrollbar-handle-container {
.data-container .scrollbar-handle-container {
width: 8px; }
.css-scrollbar .scrollbar-handle {
.data-container .scrollbar-handle {
width: 8px; }
.css-scrollbar.data-container .scrollbar-handle-container {
.data-container .scrollbar-handle-container {
background-color: #FFF; }
.css-scrollbar.data-container .scrollbar-handle {
.data-container .scrollbar-handle {
background-color: #CCC; }
.css-scrollbar.data-container .scrollbar-handle:hover {
.data-container .scrollbar-handle:hover {
background-color: #999; }
.css-scrollbar.data-container .scrollbar-handle.move {
.data-container .scrollbar-handle.move {
background-color: #AAA; }
.css-scrollbar.player-container .scrollbar-handle-container {
.player-container .scrollbar-pane {
margin-right: 8px; }
.player-container .scrollbar-handle-container {
width: 8px; }
.player-container .scrollbar-handle {
width: 8px; }
.player-container .scrollbar-handle-container {
background-color: #222; }
.css-scrollbar.player-container .scrollbar-handle {
.player-container .scrollbar-handle {
background-color: #444; }
.css-scrollbar.player-container .scrollbar-handle:hover {
.player-container .scrollbar-handle:hover {
background-color: #666; }
.css-scrollbar.player-container .scrollbar-handle.move {
.player-container .scrollbar-handle.move {
background-color: #888; }
.error_page {