我怎樣才能完全禁用popover的轉換？

我知道我可以使用hoverOpenDelay={0}和hoverCloseDelay={0}，但就我所知，popover容器仍然有100ms的不透明度過渡，我無法改變。我想刪除此轉換，以便彈出窗口立即顯示。我怎樣才能完全禁用popover的轉換？

謝謝你的幫助！

來源

2017-08-13 Will

這很難。 Blueprint使用react-addons-css-transition-group庫將-enter,-appear,-leave,-enter-active,-appear-active,-leave-active後綴添加到需要動畫的元素的某些類名稱。在你的情況下，你可能需要手動覆蓋疊加樣式，例如是這樣的：

.pt-overlay-enter, 
.pt-overlay-appear { 
    opacity: 0; 
} 

.pt-overlay-enter-active, 
.pt-overlay-appear-active { 
    opacity: 1; 
    transition-property: opacity; 
    // `step` didn't work cross browser for me 
    transition-timing-function: ease; 
    // i've found 0ms is causes react-addons-css-transition-group to fire events unreliable on certain browsers 
    transition-duration: 1ms 
    transition-delay: 0; 
}

當然，你要縮小這些規則只範圍適用於您要刪除的動畫popovers。

如果您想查看blueprint正在做什麼來設置動畫生命週期類的樣式，請檢查樣式here。 react-transition mixin使用here（以及其他地方）。

來源

2017-08-14 21:27:18

是的，問題是將轉換持續時間設置爲0ms，就像您提到的那樣，導致popover可靠地顯示或隱藏。這似乎是處理事情的一個非常糟糕的方式。有沒有什麼辦法可以禁用這個組件的react-addons-css-transition？ 1ms的延遲是可感知的。 – Will

不是我所知道的。是的，「1ms」對我來說已經足夠好了，但是肯定有一個動畫框架。該庫相當根深蒂固到Blueprint中，但應該很容易向用戶公開一個道具以禁用每個組件的動畫。對於大多數用戶來說，這還不是一個大問題，但我鼓勵你在Github回購站上提交一張票。 –

我怎樣才能完全禁用popover的轉換？

回答

相關問題