how to scroll the element belong to a group? Options

[ericsia]

It is too hard to describe as word, here is what I mean:
https://jsbin.com/kalodos/edit?html,css,output

[ericsia]

Note: I need to change the background color when mouse hover

[Christian J]

It is too hard to describe as word, here is what I mean:
https://jsbin.com/kalodos/edit?html,css,output

Do you want the lines of 1:s to scroll even when the mouse is hovering over the fixed "mouse on me and scroll"-text?

[ericsia]

Do you want the lines of 1:s to scroll even when the mouse is hovering over the fixed "mouse on me and scroll"-text?

yes, that is what I wish to achieve. I hope there is pure css solution

This post has been edited by ericsia: Feb 12 2023, 03:37 PM

[Christian J]

I don't think it's possible. You can still scroll it with the Up/Down keys though.

[ericsia]

user will scroll using mouse wheel most likely

[pandy]

I don't understand. When I hold the pointer over the square it changes colour and I can scroll the lines with the mouse wheel. What's the problem?

[Christian J]

I don't understand. When I hold the pointer over the square it changes colour and I can scroll the lines with the mouse wheel.

I can't do that, not even in K-Meleon. Are you sure it's not the viewport scrollbar you see moving?

[pandy]

Of course the scrollbar moves. How else would it happen? The OP just said he wanted scroll when the mouse pointer is over the fixed box and that works for me.

[ericsia]

I don't understand. When I hold the pointer over the square it changes colour and I can scroll the lines with the mouse wheel.

I can't do that, not even in K-Meleon. Are you sure it's not the viewport scrollbar you see moving?

I can't scroll it either. I want the inner items (onesssss) to scroll when the mouse is on the square.
Owh btw, I'm looking for a pure css solution.

[pandy]

But they do scroll. I.e. the page scrolls but the fixed box stays put. What browser do you use?

[Christian J]

I want the inner items (onesssss) to scroll when the mouse is on the square.

Yes that's what I meant too, the DIV with "overflow: auto". But do you really need nested scrollable sections like that on the page? It might be difficult to use even if it worked.

But the do scroll. I.e. the page scrolls but the fixed box stays put.

I can scroll the page too, but occasionally even that it stops working (at least in Vivaldi). Not sure why, maybe it's a bug.

[coothead]

Hi there ericsia,

I have made an example that will only scroll the content, with
the wheel, when the mouse is over the blue to red panel.

Of course if the mouse does not have a wheel................

If it does, then you may see the fruits of may labours here...

Full Page View
https://codepen.io/coothead/full/RwYbvra

...and the code here...

Editor View
https://codepen.io/coothead/pen/RwYbvra

coothead

[pandy]

I want the inner items (onesssss) to scroll when the mouse is on the square.

Yes that's what I meant too, the DIV with "overflow: auto". But do you really need nested scrollable sections like that on the page? It might be difficult to use even if it worked.

But the do scroll. I.e. the page scrolls but the fixed box stays put.

I can scroll the page too, but occasionally even that it stops working (at least in Vivaldi). Not sure why, maybe it's a bug.

It scrolls in k-mel, FF and Edge. It's normal page scroll for pete's sake. What are you guys on about? Do mean some other scrolling than the one I see?

[ericsia]

I want the inner items (onesssss) to scroll when the mouse is on the square.

Yes that's what I meant too, the DIV with "overflow: auto". But do you really need nested scrollable sections like that on the page? It might be difficult to use even if it worked.

Yes I need that, the blue box was meant to be a message box with transparent background, but I added color to help us see the region

[ericsia]

Hi there ericsia,

I have made an example that will only scroll the content, with
the wheel, when the mouse is over the blue to red panel.

Of course if the mouse does not have a wheel................

If it does, then you may see the fruits of may labours here...

Full Page View
https://codepen.io/coothead/full/RwYbvra

...and the code here...

Editor View
https://codepen.io/coothead/pen/RwYbvra

coothead

For a moment I thought yours is the solution, but now our mouse is on onesss it don't scroll thought.

[ericsia]

I want the inner items (onesssss) to scroll when the mouse is on the square.

Yes that's what I meant too, the DIV with "overflow: auto". But do you really need nested scrollable sections like that on the page? It might be difficult to use even if it worked.

But the do scroll. I.e. the page scrolls but the fixed box stays put.

I can scroll the page too, but occasionally even that it stops working (at least in Vivaldi). Not sure why, maybe it's a bug.

It scrolls in k-mel, FF and Edge. It's normal page scroll for pete's sake. What are you guys on about? Do mean some other scrolling than the one I see?

I mean this one

[pandy]

Yes? I hold the pointer over the box. It changes colour and when I spin the mouse wheel the page scrolls and the scrollbar moves. What do you want different?

And what browser do you use if you don't see what I see?

[ericsia]

Yes? I hold the pointer over the box. It changes colour and when I spin the mouse wheel the page scrolls and the scrollbar moves. What do you want different?

And what browser do you use if you don't see what I see?

did it scroll for a while or u can see all the onesss until it reached bottom? Opera, google chrome and samsung mobile browser can't scroll the inner content (onessss)

[coothead]

. For a moment I thought yours is the solution, but
. now our mouse is on onesss it don't scroll thought.

I thought that you only wanted scroll wheel effect on the blue/red thingy.

No problem.

Just make a return journey to these little buggers...

• Full Page View
  https://codepen.io/coothead/full/RwYbvra
  
• Editor View
  https://codepen.io/coothead/pen/RwYbvra

voilà, the mouse wheel will work with what was wanted by you.

coothead