[JS]ぷるぷるとかわいいアニメーションでモーダルボックスを表示させるスクリプト -Stackbox
demo: video YouTubeの動画もさまざまなアニメーションで表示できます。 Stackboxの使い方 Step 1: 外部ファイル 当スタイルシート・スクリプトとjqury.jsを外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="../build/css/stackbox-docs.min.css"> </head> <body> ... <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="../build/js/stackbox-docs.min.js"></script> </body> Step 2: HTML まずは、モーダ
[JS]CSS3アニメーションを使ったページが簡単な記述で面白いように実装できるスクリプト -AniJS
スクロールするとヘッダがアニメーションで移動したり、コンテンツが次々とスライドして表示されたり、ページのロード時にふわっと表示したりなど、スクロール、ロード、クリック、ホバー、フォーカスなどのさまざまなイベントをトリガーにCSS3アニメーションを適用できるスクリプトを紹介します。 jQueryなどの他のスクリプトは不要です。 AniJS -CodePen こちらのデモでは、ロード時にぶらぶら揺れて表示し、ヘッダのクリック、フッタのクリックにもアニメーションが仕込まれています。 AniJSの使い方 Step 1: 外部ファイル 当スクリプトを</body>の上、アニメーション用のスタイルシート「animate.css」をhead内に記述します。 <head> ... <link rel="stylesheet" href="http://cdn.jsdelivr.net/animatecss
[JS]アイデアが素晴らしい！ページにちょっとしたアクセントを加えるスクリプトのまとめ
そのまま使ってもよし、アイデアに刺激されインスパイアされてもよし、の工夫をこらした素晴らしいアイデアのスクリプトを紹介します。
[JS]ユーザーがどのようにスクロールしてページを見ているかGoogle Analyticsで解析できるスクリプト -Scroll Depth
ユーザーがページを見た際に、どのくらいスクロールされているのか、また指定した要素がスクロールされて表示されるまでにどのくらいかかるのか、といったデータをGoogle Analytics上で解析できるようにするjQueryのプラグインを紹介します。 実装は簡単、ほんの数行ページに加えるだけです。 Scroll Depth Scroll Depth -GitHub Scroll Depthのデモ Scroll Depthの使い方 Scroll Depthのデモ Scroll Depthは、Universal Analytics, Classic Google Analyticsに対応しており、Google Tag Managerもサポートしています。 対応ブラウザは、Chrome, Safari, Firefox, Opera, IE7-10で、スマフォもiOS, Mobile Opera,
[JS]スクリプト初心者でも簡単！レスポンシブ対応のナビゲーションやコンテンツを横から表示するスクリプト -Slidebars
最近よく見かけるトレンドの一つ「Off Canvas」、コンテンツの横からナビゲーションやコンテンツをアニメーションでスライド表示するjQueryのプラグインを紹介します。 デモページ：幅780pxで表示 Slidebarsの使い方 Step 1: 外部ファイル 当スタイルシートをhead内に、jquery.jsと当スクリプトを</body>の上に記述します。 <head> ... <link rel="stylesheet" href="slidebars.min.css"> <head> <body> ... <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="slidebars.min.js"></script> </body> St
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
