Drag slider position on bar, and no jump on drag

It looks like you're adapting a CreateJS example routine, and you're doing things that Animate would normally take care of for you. With Animate you could also create the shapes instead of doing it in code.

While you are doing it in code you could add this line to solve the problem you've asked about:

orangeHash.y = bounds.y;

Another issue is that the stage itself has a scale, but the stageX value isn't based on the scaled coordinate.

With removing the not needed updates, and simplifying the offset variable, this works better (note too the eve.stageX/stage.scaleX part):

var orangeHash = new createjs.Shape(new createjs.Graphics().beginFill("#ff8000").drawRect(0, 0, 20, 60));

orangeHash.setBounds(0, 0, 30, 60);

var orangeHashBounds = orangeHash.getBounds();

console.log(orangeHashBounds);

var regX;

var orangeHashBoundary = new createjs.Shape();

orangeHashBoundary.graphics.beginStroke("#999")

  .setStrokeStyle(1)

  .drawRect(117, 376, 1206, 60);

orangeHashBoundary.snapToPixel = true;

orangeHashBoundary.setBounds(117, 376, 1200, 60);

var bounds = orangeHashBoundary.getBounds();

stage.addChild(orangeHashBoundary, orangeHash);

orangeHash.on("mousedown", function (e) {

  regX = orangeHash.x - e.stageX;

});

orangeHash.on("pressmove", function (evt) {

  evt.currentTarget.x = Math.max(bounds.x + regX,

  Math.min(bounds.x + bounds.width - orangeHashBounds.width + regX, evt.stageX/stage.scaleX));

});

orangeHash.x = bounds.x

orangeHash.y = bounds.y

this.stop();