aboutsummaryrefslogtreecommitdiffstats
path: root/demos/slider/side-scroll.html
diff options
context:
space:
mode:
Diffstat (limited to 'demos/slider/side-scroll.html')
-rw-r--r--demos/slider/side-scroll.html16
1 files changed, 8 insertions, 8 deletions
diff --git a/demos/slider/side-scroll.html b/demos/slider/side-scroll.html
index 7dff3831c..1be75da54 100644
--- a/demos/slider/side-scroll.html
+++ b/demos/slider/side-scroll.html
@@ -4,7 +4,7 @@
<meta charset="utf-8">
<title>jQuery UI Slider - Slider scrollbar</title>
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.8.3.js"></script>
+ <script src="../../jquery-1.9.0.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.mouse.js"></script>
@@ -25,7 +25,7 @@
//scrollpane parts
var scrollPane = $( ".scroll-pane" ),
scrollContent = $( ".scroll-content" );
-
+
//build slider
var scrollbar = $( ".scroll-bar" ).slider({
slide: function( event, ui ) {
@@ -38,7 +38,7 @@
}
}
});
-
+
//append icon to handle
var handleHelper = scrollbar.find( ".ui-slider-handle" )
.mousedown(function() {
@@ -49,10 +49,10 @@
})
.append( "<span class='ui-icon ui-icon-grip-dotted-vertical'></span>" )
.wrap( "<div class='ui-handle-helper-parent'></div>" ).parent();
-
+
//change overflow to hidden now that slider handles the scrolling
scrollPane.css( "overflow", "hidden" );
-
+
//size scrollbar and handle proportionally to scroll distance
function sizeScrollbar() {
var remainder = scrollContent.width() - scrollPane.width();
@@ -64,7 +64,7 @@
});
handleHelper.width( "" ).width( scrollbar.width() - handleSize );
}
-
+
//reset slider value based on scroll content position
function resetValue() {
var remainder = scrollPane.width() - scrollContent.width();
@@ -73,7 +73,7 @@
var percentage = Math.round( leftVal / remainder * 100 );
scrollbar.slider( "value", percentage );
}
-
+
//if the slider is 100% and window gets larger, reveal content
function reflowContent() {
var showing = scrollContent.width() + parseInt( scrollContent.css( "margin-left" ), 10 );
@@ -82,7 +82,7 @@
scrollContent.css( "margin-left", parseInt( scrollContent.css( "margin-left" ), 10 ) + gap );
}
}
-
+
//change handle position on window resize
$( window ).resize(function() {
resetValue();