タグ

2011年10月24日のブックマーク (7件)

  • CSS拡張メタ言語「SCSS(Sass)」と「LESS」の比較 - (DxD)∞

    CSSを拡張するためのメタ言語として、代表的なものに「SCSS(Sass)」と「LESS」があります。今回、導入を検討するにあたり、両者を比較しました。 結果的には、「SCSS(Sass)」を導入することにしましたが、特に「SCSS(Sass)」を選択する決め手となった点に重点を置きつつ、両者の違いをまとめまてみました。 はじめに Webサイト、Webアプリケーションが大規模になるにつれて、CSSの設計・管理にもリソースを割かれるようになります。CSSのモジュール化、コンポーネント化による再利用性を考えたとき、現状のCSSを取り巻く状況は十分とは言えません。 一つの選択肢としてあがるのが「Blueprint」や「960 Glid System」等のCSSフレームワークの利用ですが、その再利用性と構造・表現の分離度はトレードオフです。 そこで、CSSの利点を活かしつつ、再利用性を高めるために

  • 『iPhoneアプリ開発、その(196) TwitBirdっぽい?』

    投稿が1千件くらいになると無制限にリストアップというわけにはいかなくなるわけでして… 対策として一般的なのが、アメブロがやってるようなページング処理なわけです。 ↑こんな感じで記事を何件かの単位でページに分けて表示してる。 次のページや前のページに戻るためのボタンを用意してページを切り替えるわけですな。 で、もう少しiPhoneらしいアプローチが、YouTubeなんかでやってる最後の行に「さらに読み込む…」って項目の表示。こいつを押すと行が追加される仕組みなわけです。 十分に直感的でナイスなんですが、こいつのさらに上をいく直感的なGUITwitteriPhoneアプリのTwitBirdで発見したんですよ。 いや~、ナイスです。 こいつは更新側だけど、最下部の項目までスクロールしてさらに引っ張ると、同じように追加の項目が読み込まれます。 スクロールバウンズ機構をうまく利用して「まだ、他に

    『iPhoneアプリ開発、その(196) TwitBirdっぽい?』
    uniq
    uniq 2011/10/24
  • 5509.me

    This domain may be for sale!

  • Canvasリファレンス - HTML5.JP

    HTML5の仕様に基づいて、Canvasで利用できるメソッドやプロパティ(属性)のリファレンスをご用意しました。主にHTML5の仕様の和訳となりますが、HTML5の仕様は非常に分かりにくい説明があるため、一部、図や補足説明を入れました。 各メソッドやプロパティごとにサンプルスクリプトもご用意しましたので、具体的なスクリプティングが理解できます。ブラウザごとの対応についても触れています。 皆様のCanvasの理解にお役に立てれば幸いです。 HTMLCanvasElement HTMLCanvasElementのメソッド

  • [CSS]iPadの横向きと縦向きでレイアウトを変更するスタイルシート

    Portraitモード(縦向き)のグリッド設計 グリッド 768=30+708+30 708=216+30+216+30+216 実装のポイント iPadの横向きと縦向きでレイアウトを変更するには2つのポイントがあります。 METAタグ iPadのスクリーンで等倍に表示されるように、METAタグで設定します。 <meta name="viewport" content="width=768px, minimum-scale=1.0, maximum-scale=1.0" /> スタイルシート 比率を等倍に設定したので、Media Queriesを使用して横向きと縦向きに分岐させます。 /* Landscapeモード(横向き)用 */ #wrap { width:1024px; } @media only screen and (orientation:portrait){ /* Portr

    uniq
    uniq 2011/10/24
  • 2011年、スマフォ・デスクトップ用のクロスブラウザ確認ツールのまとめ

    デスクトップ用の各ブラウザをはじめ、スマートフォン、ワイドスクリーンなど、さまざまユーザー環境を想定して確認できるツールを紹介します。 各ツールで表示しているのは、Media Queriesを使用している「CSS-Tricks」です。

  • ブラウザ上でHTML / CSS / Javascriptを書いてその場で実行、ブログ等にも貼付できるjsfiddleの基本的な使い方をざっくりと

    個人的にお勧めしているjsfiddleですが、せっかくなのでちゃんと記事にして普及活動をしてみようかなと思います。jQueryのコードを気軽に試す、などにも最適です。 全部は書ききれないのでざっくりと、程度です。一応基的な部分だけ・・jsdo.itでいいじゃんとか言われそうな空気満々ですが、いいならこんな記事書きませんのでお察し頂ければ幸いです。 jsfiddleとは、その場でjsコードを実行、動作テストできるツールで、人気のjsライブラリのjQueryの公式サイトでもバグを伝えるときはjsfiddleを使用して動作を見せるように薦められます。 When You Report A link to a reduced, working demo/test case that will never move (jsFiddle is good for this). (意訳:バグを報告するとき

    ブラウザ上でHTML / CSS / Javascriptを書いてその場で実行、ブログ等にも貼付できるjsfiddleの基本的な使い方をざっくりと