using jquery ui draggable changes the state of an element from absolute to relative popcorn-port
authorhamidouk
Mon, 19 Dec 2011 15:25:22 +0100
branchpopcorn-port
changeset 481 a46cfeee6d77
parent 480 043a159c75f0
child 482 1c225a39a3b1
using jquery ui draggable changes the state of an element from absolute to relative positioning, which breaks the way our seek button expands itself, so we need to force absolute positioning, quite uglily, using jquery.
src/js/widgets/sliderWidget.js
--- a/src/js/widgets/sliderWidget.js	Mon Dec 19 12:30:45 2011 +0100
+++ b/src/js/widgets/sliderWidget.js	Mon Dec 19 15:25:22 2011 +0100
@@ -24,12 +24,14 @@
   this.sliderMaximized = false;
   this.timeOutId = null;
 
+  
   this.positionMarker.draggable({axis: "x",
   start: IriSP.wrap(this, this.positionMarkerDraggingStartedHandler),
   stop: IriSP.wrap(this, this.positionMarkerDraggedHandler),
   containment: "parent"
   });
-
+  this.positionMarker.css("position", "absolute");
+  
   this.sliderBackground.click(function(event) { self.backgroundClickHandler.call(self, event); });
   this.sliderForeground.click(function(event) { self.foregroundClickHandler.call(self, event); });
 
@@ -112,7 +114,7 @@
   this.sliderBackground.animate({"height": "9px"}, 100);
   this.sliderForeground.animate({"height": "9px"}, 100);
   this.positionMarker.animate({"height": "9px", "width": "9px"}, 100);
-  this.positionMarker.css("margin-top", "-4px");
+  //this.positionMarker.css("margin-top", "-4px");
   
 //  this.selector.removeClass("Ldt-SliderMinimized");
 //  this.selector.addClass("Ldt-SliderMaximized");