GitHubの登場によってオープンソースのプロジェクトが右上にリボンを付けているケースが増えてきました。それをクリックするとGitHubのプロジェクトページに遷移すると言った具合です。プロジェクトへの参加を促したり、フォークしたりと活動を活性化するのに役立っています。 そんなリボンで遊んでしまおうというのがforkit.jsです。オープンソースに限らず使えますので遊んでみるのはいかがでしょう。

forkit.jsの使い方

forkit.jsをつけるとこんな感じに表示されます。

いかにも怪しげなトップシークレットの文字…。マウスを持っていってみましょう。

リボンがぷらんと垂れました。さらにDrag downの文字。これは気になる!

そしてリボンを引っ張ると秘密のコンテンツが。これは実際にあなたの目でご覧ください。

リボンをアニメーションさせることでユーザの目を引きつける面白いテクニックですね。色や文字はカスタマイズできますので自分のサイトに合わせて変更してみると面白そうです。

forkit.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

hakimel/forkit.js