レスポンシブデザインを制作するなら頭に入れておくべき基本事項7つ | 株式会社LIG
どうも〜こんにちはぁ！ 最近レスポンシブなサイトを作ることが多いライターの、のび太です。 モバイル、タブレットユーザーが最近どんどん増えてきているので、Web制作者にとってレスポンシブなサイトが作れるってことが必須になるんじゃないかなぁ〜って感じますね。 レスポンシブデザインを制作するときに意識しなきゃいけないことはいろいろありますが、今回は「これはぜったいに知っておきたいよね！」って感じた基本的なことを7つご紹介させていただきたいと思います。 レスポンシブデザインを制作するときに意識しておきたい基本項目7つ 1. 画像の代わりになるべくCSSで表現すべし レスポンシブデザインで画像を使うと、モバイル端末ではPCに比べて回線速度が遅いため、読み込み時間が余計にかかってしまいます。 そのため、画像ではなくCSSで表現可能なものはどんどん代替していったほうがいいと思います。 立体ボタンや矢印だ
[JS]アニメーションgifにスタートとストップ機能をつけられるスクリプト -gifplayer
アニメーションgifは画像が表示されるとすぐにアニメーションが動き出しますが、それらのアニメーションgifにスタートとストップ機能をつけられるjQueryのプラグインを紹介します。 スタートをクリックしてからアニメーションgifをロードするので、ページの軽量化にもなる優れものです。 gifplayer gifplayer -GitHub gifplayerのデモ gifplayerの使い方 gifplayerのデモ デモでは、アニメーションgifの画像にオーバーレイで「gif」と表示されており、クリックするとアニメーションgifが再生されます。 再生中にアニメーションgifをクリックすると、ストップします。 gifplayer: demo 「gif」ボタンのとこには、三角アイコンや「再生」ボタンでもよさそうですね。 gifplayerの使い方 Step 1: 外部ファイル jquery.j
インライン編集できるテーブル実装用jQueryプラグイン「editable-table」:phpspot開発日誌
mindmup/editable-table GitHub インライン編集できるテーブル実装用jQueryプラグイン「editable-table」 セルをクリックで即座に編集可能なテーブルが実現できます。Bootstrapと組み合わせでいい感じに動きます。 単に編集できるだけではなくて、合計値を計算してセルに反映する、なんていう機能もついています。 関連エントリ テーブルを折りたたみ可能なツリー型グリッドに変換できる「TreeGrid」 テーブルに検索、ソート、ページ分け機能をつけて便利にしてくれる「Dable」 テーブルを様々なグラフに自動変換できるjQueryプラグイン「HighchartTable」 Bootstrap対応でレスポンシブなWYSIWYGエディタ「Summernote」 Bootstrapなデザインのデータグリッドを実装できる「Open JS Grid」
私服がダサいやつが１０万円を投資して渋谷のカリスマになった話 | オモコロ
「渋谷ファッションフェスティバル」で公募していた「ダサい人」に選ばれて１０万円分のファッション手当を貰いました。よっしゃー！この１０万円で更にダサい服を買うぞー！ こんにちは。ヨッピーです。 「服がダサい」事でお馴染みです。 ※「服がダサい」とよく揶揄される僕の服装参考例。 まあ僕ってば基本的にユニクロでしか服を買いませんので、 「国民服と呼ばれるほど流通しているユニクロの服を着てダサいなどと言われるのは心外だし国民服がダサいのであれば日本国民全員がダサいと言ってるのと同義だから天に唾を吐くようなもので情弱はそこを理解していなくて哀れ」 などと思っているのですが、 ちょくちょくTwitterなどで、 ・ヨッピーまた同じ服着てる ・電車内でヨッピーさんらしき人を見たけど記事と同じ黒のダウン着てたからたぶん本人 ・いつもパーカー などと揶揄される始末。 とは言え、服にン万円も払ってオシャレする
ゲーム感覚でCSSのセレクタを学ぼう！ - 有限な時間の果てに
2014-03-26 ゲーム感覚でCSSのセレクタを学ぼう！ CSS 今日は、ゲーム感覚でCSSのセレクタが学べるCSS Diner - Where we feast on CSS Selectors!を紹介します。 もともと、CSSのセレクタがちょっとあやふやな人はやってみて！ 楽しみながらCSSのセレクタを学ぶ -CSS Diner | コリスで見つけたものですが、面白いのでここでも紹介します。 やりかたは簡単、セレクタを打ち込んでEnter 正解なら次のLevelに進みます。 全部で26のレベルがあり、最後のほうは考えさせられます。 また、視覚的な分かりやすさがあります。 個人的には、CSS3で追加された:nth-of-type(n)や:not()について勉強になりました。 参考にしたもの CSS Diner - Where we feast on CSS Selec
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
