MUI has a slider component: https://mui.com/material-ui/react-slider/

I'm trying to figure out how to disable the animaiton that plays on the nub to move it to the new position so it moves instantly instead. Is there any way to do this?

CodePudding user response：

You need to turn off transition property for thumb and track elements of slider with styled utility:

import Slider from '@mui/material/Slider';
import { styled } from '@mui/material/styles';

const CustomSlider = styled(Slider)(({ theme }) => ({
  "& .MuiSlider-thumb": {
    transition: 'none'
  },
  "& .MuiSlider-track": {
    transition: 'none'
  },
}));