这是我在 Firefox 中的 userChrome.css 中的一个元素，用于与 Tree Style Tabs 插件交互：

/* Auto-show/hide sidebar by mouseover (hover) */ 

/*Collapse in default state and add transition*/
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] {
  overflow: hidden;
  min-width: 40px;
  max-width: 40px;
  transition: all 0.2s ease;
  border-right: 1px solid #0c0c0d;
  z-index: 2;
}

/*Expand to 260px on hover*/
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]:hover,#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar {
  min-width: 260px !important;
  max-width: 260px !important;
  z-index: 1;
}

当前的行为是在悬停时展开侧边栏，并在失去鼠标指针悬停时折叠侧边栏。然而，我想要的行为是在我悬停并单击侧边栏时展开侧边栏，但在鼠标失去悬停时使其折叠，而不必在侧边栏外单击。有没有办法做到这一点？我尝试了很多方法，但由于我对 CSS 的初级水平的了解似乎没有任何效果。

先谢谢大家。