Skip to main content
V
19-Tanzanite
Velkumar19-Tanzanite
19-Tanzanite
June 1, 2026
Question

Collection Widget - Scroll bar visible only on hover

  • June 1, 2026
  • 1 reply
  • 36 views

Hi,

 

How to change scroll bar properties of collection widget using custom css. Mainly I want it to be visible only on hover. 

 

Twx version : 9.7.1

1 reply

V
19-Tanzanite
Velkumar19-TanzaniteAuthor
19-Tanzanite
June 1, 2026

I just found a solution 

@supports (ptcs-style-unit: "PTCS-COLLECTION") {
  ::-webkit-scrollbar {
    width: 3px;
    height: 6px;            
  }
  ::-webkit-scrollbar-track {
    background: transparent;
  }
  ::-webkit-scrollbar-thumb {
    background: transparent; 
    border-radius: 4px;
  }
  :host(:hover) ::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.35);  
  }
  :host(:hover) ::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);  
  }
}

 

Terms & ConditionsAccessibility statement