Trying to do a grab scroll with JS - not working

hey guys so I am trying to do a grab scroll for my webpage but it is not working somehow I’ve set up the Section element with the “content” id and I’m just using this css to test it

#content {
background-color: red;
width: 200px;
height: 250px;
overflow-x: hidden;
overflow-y: scroll;
cursor: grab;

#content div {
background-color: blue;
margin: 30px;
width: 100px;
height: 100px;

but the javascript works on jsfiddle but not on Bricks, I’ve tried it to paste in the code element, Page Settings and the Settings-custom code but it is not working here’s the JS

const content = document.getElementById(‘content’);
let isDown = false;
let startY;
let scrollTop;

content.addEventListener(‘mousedown’, (e) => {
isDown = true;
startY = e.pageY;
scrollTop = content.scrollTop;

content.addEventListener(‘mouseleave’, () => {
isDown = false;

content.addEventListener(‘mouseup’, () => {
isDown = false;

content.addEventListener(‘mousemove’, (e) => {
if (isDown) {
const y = e.pageY;
const scrollAmount = (y - startY) * 2; // Adjust this value for scroll speed
content.scrollTop = scrollTop - scrollAmount;


is there any other way to do this, thanks or what might be the problem!?

Edit: the jsfiddle

here use this

1 Like

i don’t know what i am doing wrong but it is not working on Bricks.

you just need to add this as script code on your page.

and give the container for cursor grab

1 Like

Oh wow man thanks so much man i didn’t know you had to put down the script tags, thank you so much.