只有CSS3的棋盤轉換？

是否有可能創造過渡的棋盤型與CSS 3只？只有CSS3的棋盤轉換？

2011-05-09 edt

我不這麼認爲。你有沒有看到類似的東西可以鏈接到？ – 2011-05-09 19:06:26

如果你想用圖片做（不知道爲什麼這與別的工作），你可以使用大量的div在網格中，都具有相同的背景圖像，但具有不同的背景位置，它看起來像一個正常的圖像。然後你可以通過絕對定位它們在這個背後有另一個圖像。然後，您可以使用不同的延遲動畫化網格上每個div的不透明度，以獲得棋盤效果。

通過使用第n個孩子選擇，你可以改變每隔一個，或更復雜的東西的延遲。

您可能希望JS將div的背景圖像設置爲它們後面的圖像，然後刪除過渡並將不透明度設置爲1.然後，您可以將圖像更改爲新的棋盤至一。

如果你做這個，請讓我知道 - 這聽起來真棒！

來源

2011-05-09 19:17:20

這是一個好主意。看起來這是唯一的方法。我希望我可以通過動畫CSS3掩碼爲棋盤格轉換提供動力......可能不存在的東西。重複這麼多次背景圖像會讓我擔心瀏覽器陷入困境。這是一個合理的擔憂嗎？或者...我可以觸發硬件加速，如圖所示？ http://24ways.org/2010/intro-to-css-3d-transforms ...這麼多新的東西學習。 – edt 2011-05-09 23:11:34

我想你只需要嘗試一下！使用畫布可能是另一種探索途徑。 – 2011-05-10 06:21:11

我不明白什麼是你的消息「過渡」。但是你可以只用css3繪製一個棋盤。看看這個：http://leaverou.me/css3patterns/#checkerboard

來源

2011-05-10 08:30:18 DoubleYo

只有CSS3的棋盤轉換？

回答

相關問題