2011年4月7日のブックマーク (5件)

  • 異なる幅・高さの画像も超綺麗に整列させるjQueryプラグイン「Atteeeeention plugin」:phpspot開発日誌

    異なる幅・高さの画像も超綺麗に整列させるjQueryプラグイン「Atteeeeention plugin」 2011年04月07日- Google image search style image alignment with jQuery Atteeeeention plugin | DreamersLab 異なる幅・高さの画像も超綺麗に並べられるjQueryプラグイン「Atteeeeention plugin」。 <img>でただ単に画像を並べると、幅、高さの違いから、ページがごちゃごちゃしてしまいますが、このプラグインを使うことでGoogle の画像検索のように綺麗にピッチリ並べられます。 普通に並べるとちょっと残念なことに。空白ができちゃいます。 プラグインを使うことで、あら綺麗。となります。 Firefox は 2以上、IEは6以上ということで殆どのブラウザに対応。 まず、必要な

  • [JS]あらゆる要素をガタガタ、ぷるぷる、ちりちりと振るわせるスクリプト -jRumble

    テキストリンクやナビゲーションなど、ページ上のあらゆる要素を振るわせるjQueryのプラグインを紹介します。 jRumble デモ 振るわせるアニメーションは、ガタガタをはじめ、ぷるぷる、ちりちり、などにすることができます。 [ad#ad-2] jRumbleの実装 jRumbleの実装は簡単です。 div要素でもリンクでも、あらゆるDOM要素をガタガタさせることができます。 JavaScript 「jquery.js」と「jrumble.1.0.js」を外部ファイルとして指定します。 <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jrumble.1.0.js"></script> JavaScript ガタガタさせるDOM要素をスクリプト

  • WebサイトをiPhoneに対応させる -レスポンシブ・ウェブデザイン- - EC studio デザインブログ

    このところのスマートフォンの広がりにより、デザイン部でもWebサイトのスマートフォン対応の必要性をひしひしと感じています。 実際のスマートフォン対応の取り組みとしてはこれからなのですが、その時のために従来のサイトをスマートフォンに対応させる方法、特に今回は閲覧環境に応じてページレイアウトを柔軟に切り替える、レスポンシブ・デザイン レスポンシブ・ウェブデザイン(Responsive Web Design)(ご指摘ありがとうございます。)に関していまさらながら調べてみたので、大枠的なことをふわっとまとめておこうと思います。 レスポンシブ・ウェブデザインって まず「レスポンシブ・ウェブデザインとはなんぞや」と言うところですが、 Webサイトのページレイアウトを閲覧環境(パソコン、iPhoneAndroid など)に応じて動的に変更させる手法で去年あたりからよく耳にするようになりました。 ブラウ

  • フォーム関連要素(3) サイトのフォームを多機能にするHTML5の新要素5選

    新たに追加された5つのフォーム関連要素 前回の「HTML5でinput要素に追加された新しいタイプ13連発」までは、HTML5において<input>要素に対して加えられた変更を見てきました。今回は、<input>要素以外のフォーム(<form>)に関連する新要素について見ていきます。今回ご紹介する要素は、以下のとおりです。 出力値を表す<output>要素 <output>要素は、プログラムによって生成された出力値を表す要素です。<output>要素を用いることで、「この部分は自動的に生成された値である」という意味を明確にできます。 for属性に、他の入力フォームのIDを指定することで、出力値の元になった入力フォームを明示的に指定できます。for属性には、複数のIDをスペースで区切って指定できます。 以下の例では、ユーザーに2つの数値を入力させ、その計算結果を自動的に算出します(このサンプ

    フォーム関連要素(3) サイトのフォームを多機能にするHTML5の新要素5選
  • HTML5とは何かを簡単にまとめてみた

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R&D統括部 制作部 ウェブデベロップメント部に所属しております。岡部和昌(@kzms2)と申します。 最近スマートフォンやタブレット向けのページを作成する機会が増えてきました。 なので、今回はちまたで大人気のHTML5について書きます。 若干今更な内容にも思えますが、あまりHTML5になじみがない方にもわかってもらえるような内容にしています。 HTML5の基概念や思想・実際の組み方というよりも、 HTML5で組むと今までと比べて何が違うのか などについて書いていきます。 なぜこれからHTML5なのか HTML4との違いがわからない HTML5を使う利点がわからない など疑問に思っている方はぜひ見ていた

    HTML5とは何かを簡単にまとめてみた