--- a/src/js/widgets/sliderWidget.js	Thu Nov 24 16:20:27 2011 +0100
+++ b/src/js/widgets/sliderWidget.js	Thu Nov 24 16:20:41 2011 +0100
@@ -8,11 +8,13 @@
   var self = this;
 
   this.selector.append(Mustache.to_html(IriSP.sliderWidget_template, {}));
+  this.selector.addClass("Ldt-SliderMinimized");
 
   this.sliderBackground = this.selector.find(".Ldt-sliderBackground");
   this.sliderForeground = this.selector.find(".Ldt-sliderForeground");
   this.positionMarker = this.selector.find(".Ldt-sliderPositionMarker");
 
+
   // a special variable to stop methods from tinkering
   // with the positionMarker when the user is dragging it
   this.draggingOngoing = false;
@@ -64,14 +66,21 @@
 
 /* handles mouse over the slider */
 IriSP.SliderWidget.prototype.mouseOverHandler = function(event) {
-/*  this.sliderBackground.animate({"padding-top": "10px", "margin-top": "-10px"}, 100);
-  this.sliderForeground.animate({"margin-top": "-10px"}, 100); */
+  this.sliderBackground.animate({"height": "10px"}, 100);
+  this.sliderForeground.animate({"height": "10px"}, 100);
+  
+//  this.selector.removeClass("Ldt-SliderMinimized");
+//  this.selector.addClass("Ldt-SliderMaximized");
 };
 
 /* handles when the mouse leaves the slider */
 IriSP.SliderWidget.prototype.mouseOutHandler = function(event) {
-/*  this.sliderBackground.animate({"padding-top": "5", "margin-top": "0px"}, 100);
-  this.sliderForeground.animate({"padding-top": "5px"}, 50); */
+  this.sliderBackground.animate({"height": "5px"}, 100);
+  this.sliderForeground.animate({"height": "5px"}, 100);
+  
+//  this.selector.removeClass("Ldt-SliderMaximized");
+//  this.selector.addClass("Ldt-SliderMinimized");
+
 };
 
 // called when the user starts dragging the position indicator