let canSlide= false;

​

function setup() {

  createCanvas(400, 400);

  aSlider = createSlider(1,20,6,0);

  aSlider.position(width/4-10,250);

  aSlider.style('width','210px');

}

​

function draw() {

  background(220);

  rectMode(CORNERS)

  fill(0);

  noStroke();

  rect (width/4, 200-5, 3*width/4, 200+5);

​

  if (mouseIsPressed){  

     if( mouseX>100 && mouseX<300 && 

      mouseY<210 && mouseY>190){

     canSlide=true;

      }

    if(canSlide){

    x = mouseX;

    fill(255,0,0)

    rect(width/4,200-5,mouseX,200+5)

       }

  }

  else{

    // let the black one follow the blue

    // comment next line to cancel

    // x = map(aSlider.value(),1,20,100,300)

  }

   ellipse(x, 200, 30);

}

​

​