let canSlide = false;

​

function setup() {

  createCanvas(400, 400);

  x = 0;

}

​

function draw() {

  background(220);

​

  // Draw the slider range

  rect(0, height / 2 - 10, width, 20);

​

  // Is my mouse pressed?

  if (mouseIsPressed) {

    // Then check to see if my mouse is within range of the slider

    if (mouseX > 0 && mouseX < width && mouseY > height / 2 - 10 && mouseY < height / 2 + 10) {

      // Turn on slide-ability

      canSlide = true;

    }

  // Turn off sliding if mouse is no longer pressed

  } else {

    canSlide = false;

  }

  // Follow the mouse if I can slide

  if (canSlide) x = mouseX;

  // Constrain to the canvas

  if(x < 0) x = 0;

  else if(x > width) x = width;

  // This is the same as:

  // x = constrain(x, 0, width);

  ellipse(x, height / 2, 50, 50);

}

​