變焦通過過渡效果

一堆網站，如http://scaleofuniverse.com/，具有可縮放的界面，讓您的項目「通過放大」，揭示包含在其中「小」項目。我一直認爲這是在Flash中完成的，但我想知道如何使用JavaScript和CSS。有沒有支持此功能的開源庫？變焦通過過渡效果

另外，我還看了一下impress.js，其中有一些非常酷的功能，但我不確定我是否能做到使用這個庫所需的效果。這只是使用正確的CSS樣式的問題嗎？

來源

2012-03-10 user2398029

我最終使用的zoom.js一個精簡版本，它提供了放大任何DOM元素上的能力。它與Zoomooz類似，但更加臃腫，並且使我可以隔離實現該效果所需的幾行代碼，而無需加載外部庫。

來源

2012-03-16 02:25:19 user2398029

該過程非常複雜，但它的可行性，這裏是一篇關於如何實現它的好文章，Create a zoomable user interface with CSS3，以及一個提供您正在尋找的近距離效果的jQuery插件，Zoomooz。

來源

2012-03-10 17:25:59

上面的鏈接現已停止。可以使用[wayback machine]（http://web.archive.org/web/20120318081036/http://www.netmagazine.com/tutorials/create-zoomable-user-interface）訪問存檔版本。但原文似乎在線[這裏]（http://www.creativebloq.com/create-zoomable-user-interface-css-transforms-9114269）。 – Deleet 2016-08-03 13:52:40

如果你的界面元素是一個HTML元素，你可以直到填滿整個屏幕，而在同一時間褪色的不透明度降低到0這一技術將取決於在界面元素正在使用的任何圖片展開元素可擴展（可能使用background-size: cover）。

你可以使用CSS轉換或JavaScript來達到的效果。

來源

2012-03-10 17:26:10 Gareth

變焦通過過渡效果

回答

相關問題