人気のあるUIサンプル

• JS 加速度検知
• スマホを振ったときにJavaScriptで仕掛けを作りたいときのサンプルです。 このサンプルではiOS、Androidのブラウザで、スマホを握って振ったときに、文字が切り替わるスクリプトを実装しています。 function ClickRequestDeviceSen...
• 2019-07-29 21:35:59

• jQuery マウスのトリガーいろいろ
• マウスの動きで発動させる場合によく使われる記述を一部列挙しておきます。 クリックしたら、何かが起こる仕掛けはよく使われますが、ダブルクリックや右クリック（＝コンテクストメニュー）でも発動させることが可能です。 マウスの場...
• 2019-07-29 21:39:13

• JS タップ圧力（感圧）検知
• スマホやタブレットなどでは、タップした圧力を検知し、操作するシーンが増えてきました。JavaScriptで圧力を数値化する関数が用意されているので、実装してみました。 画面をグッと押し込むと発動するサンプルです。 このサンプルはスマホやタブレットなどのタップの圧力を検知できる端末で参照してください。 #press...
• 2019-07-29 21:46:07

• CSS3 flexを使った配置１（横の位置）
• flexを使ってfloatのような配置を実装します。 CSS3より追加されたflexのサンプルです。 flexという言葉の通りこれがあればレイアウトをうまいことやってくれるのでfloatやmarginで悩むことが減りそうです。...
• 2019-07-29 21:51:41

• jQuery Googleカレンダー予定追加
• イベントを開催するページなどでGoogleのカレンダーに予定追加させるリンクの作成ツールです。 スケジュール情報をパラメータで渡すと、Googleカレンダーの予定登録ページのデフォルト値として登録画面へ遷移できます。 開催者としては予定の登録を補助と...
• 2019-07-29 21:59:05

• jQuery 非同期通信の完了検知
• jQueryのajaxメソッドの通信の完了を検知して、次の処理を実装するサンプルです。 jQueryでは簡単に非同期の通信が実装できるよう用意されています。 その中で、今回は通信の完了にフォーカスしたいと思います。 完了をきっかけに使えば、...
• 2019-07-30 07:42:23

• iPhone サファリでアドレスバー制御
• アドレスバー、フッターバーの制御 【iOS7.1のみ】アドレスバーを小さくし、フッターを非表示にするには minimal-uiを設定する [[<meta name="vi...
• 2019-07-30 07:51:13

• jQuery スクロールでアニメ
• skrollr.jsというjQueryのライブラリを使って、スクロールで連動する基本的なアニメーションのサンプルを用意しました。 これを使うことで、パララックス（視...
• 2019-07-30 07:56:53

• JavaScript 文字省略　clamp.js
• 長い文章を読みやすく短く省略して見せる方法の一つを紹介します。 CSSなどで隠すのでもなく、PHPでサーバサイドで編集もしません。 JavaScriptでカットする方...
• 2019-07-30 08:14:51

• webGL 図形を描画してみる
• WebGLについてです。WebGL(Web Graphics Library)は、ブラウザで３Dを表現するときの標準仕様です。2016年現在の最新版のブラウザはほぼ全て対応しています。HTM...
• 2019-07-30 21:21:19