メモ
.p-category{ position: absolute; right: 2px; }
Macの定番スクリーンセーバーとして知られた「After Dark」をCSSで再現したウェブサイトが登場しました。「フライングトースター」などのスクリーンセーバーに再び浸ることができます。
After Dark Screensavers in CSS
https://www.bryanbraun.com/after-dark-css/
ウェブサイトにアクセスすると以下のような画面が表示されるので、どれかを選んでクリックします。
1つ目は、After Darkの中で最も有名な「Flying Toasters」です。羽の生えたトースターが飛ぶ様子が映し出されます。
After Dark Screensavers in CSS “Flying Toasters” – YouTube
[embedded content]
いろいろな魚が泳ぐ「Fish」
After Dark Screensavers in CSS “Fish” – YouTube
[embedded content]
地球が飛び回る「Globe」
After Dark Screensavers in CSS “Globe” – YouTube
[embedded content]
雨がぽつぽつと降る様子を描く「Hard Rain」
After Dark Screensavers in CSS “Hard Rain” – YouTube
[embedded content]
白いボールが飛び回る「Bouncing Ball」
After Dark Screensavers in CSS “Bouncing Ball” – YouTube
[embedded content]
星間をワープしているような「Warp」
After Dark Screensavers in CSS “Warp” – YouTube
[embedded content]
「OUT TO LUNCH(昼食に出ています)」と表示する「Messages」
After Dark Screensavers in CSS “Messages” – YouTube
[embedded content]
「Why are you staring at my macintosh？(なぜ私のMacを見つめているんですか？)」と表示する「Messages 2」
After Dark Screensavers in CSS “Messages 2” – YouTube
[embedded content]
表示がだんだんと消える「Fade Out」
After Dark Screensavers in CSS “Fade Out” – YouTube
[embedded content]
After Darkを設計したBerkeley Systemsのロゴが表示される「Logo」
After Dark Screensavers in CSS “Logo” – YouTube
[embedded content]
激しい雨が降る様子を描く「Rainstorm」
After Dark Screensavers in CSS “Rainstorm” – YouTube
[embedded content]
スポットライトを照らす「Spotlight」
After Dark Screensavers in CSS “Spotlight” – YouTube
[embedded content]
「Randomizer」をクリックすると、12種類あるスクリーンセーバーのうち1つがランダムで表示されます。
この記事のタイトルとURLをコピーする
