[B! まとめ] tact_tomiのブックマーク

[JS]最近のWebサイトで見かける面白い仕掛けや便利な機能を実装するスクリプトのまとめ

最近のWebサイトでよく見かける面白い仕掛けのコンテンツやエフェクト、便利な機能を実装できるjQueryのプラグインやスクリプトを紹介します。 Midnight デモページロゴやヘッダなどをスクロール時に固定表示し、スクロールして表示されたコンテンツに応じて、固定エレメントのスタイルシートを変更させて表示するjQueryのプラグイン。デモでは、表示されているコンテンツに応じて、ロゴの背景色とカラーが変わります。 Off Canvas Menu Effects デモページメニューをサイドやトップ・ボトムから気持ちいいアニメーションで表示させるOff Canvas Menuのかっこいいエフェクトのまとめ。アニメーションのバリエーションとして見るだけでも楽しいです。

tact_tomi 2014/09/29

リンク

JavaScriptまとめページ｜WEB Drawer｜web制作に関するネタの引き出しサイト

スライダーさまざまな動きをするjQueryスライダーを作ってみたコンテンツを横にアコーディオンで表示させるjQuery コンテンツに関する動き jQueryでコンテンツをランダムに入れ替える jQueryの$.loadと$.ajaxを使って他のページの内容を読み込む方法 JavaScriptの配列を特定の順番にソートする方法 jQuery.Deferredを使って、xml読み込んでから他の処理を実行する方法 pinterest風のタイル上に並べるjQueryを作ってみたプラグインの作り方 jQueryプラグインの作り方の初歩アニメーション jQueryのanimateを使ったアニメーションスライドダウン複数のスライドダウンコンテンツを実装するjQuery jQueryを使ったアコーディオンスクロールに関する動きコンテンツが下からスクロールで表示されるjQueryプラグイン

tact_tomi 2014/05/20

リンク

感性を鍛えよう！動きが気持ちいいUIアニメーションまとめ

こんにちは。MUUUUU.ORGの中の人こと、 Quoitworks（クオートワークス）のムラマツ（マツムラではありません）です。ブラウザの進化により昨今のwebサイトでは色々なアニメーションが実装できるようになってきました。そこで今回は動きに対する感性を磨き、「もっと気持ち良い感じに」というクライアントの要望をスマートにかなえる事ができるように、セクシーだと思ったUIアニメーションを、エイヤエイヤとまとめてみました。（すみません！サイト負荷が高くサーバーがダウンしてしまうので、一部リンクのみになってます） line25.com https://dribbble.com/shots/1448379-Lookbook-nu-app https://medium.com/ui-ux-articles/3d1b0a9b810e http://thedesigninspiration.com/

tact_tomi 2014/05/20

リンク

とても効率的になった！HTML5に関する「役立つ」まとめ

作成：2013/12/16 更新：2014/11/01 Web制作 > サイト構築をするときに、フォームまわりの改善や動画やAPIを使わなくてはいけない機会があったので、ついでにHTML５のマークアップをおさらいをしました。今回はサイトを構築する上で覚えておくと役に立つ、使用頻度の高いポイントだけおさえてまとめました。エンジニア速報は Twitter の@commteで配信しています。もくじ HTML5 タグ一覧１．フォーム（input ）関連の便利な新要素２．基本要素一覧動画／音楽再生３．video タグ４．audio タグアプリケーション向けの機能／API ５．位置情報を取得する６．ローカルストレージ７．サーバー双方向通信８．バックグラウンド処理９．ファイル操作サンプル１０．ソースコードつきのサンプルテンプレート１１．テンプレート＋作成ツール HTML5

tact_tomi 2013/12/16

リンク

知っておくと速い！CSS3に関する「便利」なまとめ

作成：2013/11/25 更新：2014/10/24 Webデザイン > 先週WordPressの自作テーマを作っていたときに、もっとCSSで効率化できないものかと、色々調べてたら結構使ってないものがありました。出来るだけ短縮できるところは短縮したいので、今回はCSSの中でもサイトを作る上で「知っておくと効率的」なものをまとめました。エンジニア速報は Twitter の@commteで配信しています。もくじ知っておきたいプロパティ１．カウント数を出力２．要素の前後に文字や画像３．カーニング４．画像フィルタ５．均等幅にレイアウト６．アニメーション一覧スマホサイト対策７．viewport ８．改行削除９．Webクリップアイコン１０．UIリセット／入力フィールド拡張１１．横並び１２．ボタンサンプル１３．画像を使わない矢印１４．自動改行１５．はみ出しを隠す１