規模，然後縮放到頂部？

我正在嘗試使用變換將圖像縮放爲原圖。規模，然後縮放到頂部？

這是我如何嘗試計算頂部和位置，它幾乎可以工作，但翻譯是基於圖像原始大小，而不是縮放大小。我可以通過不同的方式應用不同的css來解決這個問題嗎？還是我必須找出另一個翻譯值？

transformCarousel() { 
    if (this.state.zoom) { 
     const heightBefore = this.state.carousel.height 
     const heightAfter = window.innerHeight * 0.792 
     const scale = heightAfter/heightBefore 
     const posBefore = this.state.carousel.top 
     const posAfter = window.pageYOffset 
     const translate = posAfter - posBefore 
     return { 
     zIndex: 1070, 
     transform: 'scale(' + scale + ') translateY(' + translate + 'px)' 
     } 
    } 
    }

來源

2016-12-28 Himmators

這實在是很難理解什麼應該發生，以便發佈重現問題的最小代碼片段。另外，我用JavaScript標記了你的問題，你也使用jQuery嗎？ – LGSon

我只是猜測你的問題是什麼。

看來，翻譯的px值應該是最終的尺度而不是開始的尺度。

此代碼將做到這一點：

transform: 'translateY(' + translate + 'px) scale(' + scale + ')'

在變換的順序是從右到左，所以規模將被應用，在此之後，翻譯會

來源

2016-12-28 17:00:21 vals

我猜OP的另一個（此後的一個）問題涉及到這個......也許甚至是一個愚蠢的，因爲他們似乎解決了同樣的問題.. upvoted – LGSon

規模，然後縮放到頂部？

回答

相關問題