タグ

2013年12月6日のブックマーク (4件)

  • 商用利用無料、スマフォ向けユーザインターフェイスの引き出しを増やすPSD素材 -Flatastic Mobile UI Kit

    ソリッドなライン、半透明のパネル、サークル状のエレメント、囲み線を使わない情報の区分けなど、美しくデザインされたスマフォ用のUI要素が100以上揃っており、しかも使用しているフォントやアイコンもセットになっているPSD素材を紹介します。 Flatastic Mobile UI Kit ダウンロードできる素材のフォーマットはPSDが2種類。 .psd (Retina Display) .psd (Standard Display) .png (プレビュー用) サイズは、Ritana Displayの方だと6,262x4,152で超高解像度! Photoshopで開くとこんな感じです。

  • 『jQuery 最高の教科書』サンプルサイト

    Chapter 02 3 ステップではじめるかんたん jQuery 入門 # Easing Chapter 04 確かな基礎力を養う jQuery の基テクニック 01 さまざまなホバーエフェクトで学ぶ動きのある表現の基 02 画像とキャプションの表現 03 丸いボタンのレイアウト 04 見え隠れするサイドバー 05 タイポグラフィの表現 # Chaper 04 完成版 Chapter 05 活用の幅を広げる jQuery の必修テクニック 01 なめらかな動きの スライドショー Basic 02 多機能なスライドショー Advanced 03 スティッキーヘッダー Basic 04 デザインが変化する スティッキーヘッダー Advanced 05 画面領域を有効活用できるタブ Basic 06 高機能で拡張しやすいタブ Advanced 07 スムーズスクロール Basic 08 拡

    『jQuery 最高の教科書』サンプルサイト
  • チャットワークがLESSを使う理由 | チャットワーククリエーターズブログ

    ChatWork デザイン部の赤堀巴絵です! ChatWork Advent Calendar5日目を担当します〜。 ご存知の方もいらっしゃると思いますが、チャットワークアプリ側はLESSで運用されています。なんでLESSで運用してるの?と聞かれることがあるのでブログで紹介したいと思います。 チャットワークがLESSを選んだ経緯まずCSSプリプロセッサの導入を社内で検討し導入しようとなった時期が2011年11月頃でした。導入にあたって問題になったことがありました。 社内のOSの開発環境がWinとMacでバラバラ社内でCSSプリプロセッサの知識が浸透していないまず、SassだとみんなにRubyをいれてもらうというハードルがありました。スタイルシートはデザイナーもコーダーもシステムエンジニアも触る状況だったので全員の環境に合わせて構築するのが難しいと考えました。 また、社内でまだCSSプリプロ

    チャットワークがLESSを使う理由 | チャットワーククリエーターズブログ
  • Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説

    Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説 上村 光星 10月12日にSass 3.3.0.rc.1が出ました。まだリリース候補ですが、どのような機能が追加されるのかはChangelogにあります。今回は「&」と@at-rootについて解説します。 HTML+CSS命名規則にBEM方法論、もしくはHTML+CSS向けに派生したMindBEMdingを取り入れる方が増えてきているようです(筆者は使っていませんが…)。「&」の新機能と@at-rootは、このBEMのためといっても過言ではありません。 Sass 3.2の「&」 「&」は親セレクタを参照する特別なキーワードとして、Sass 3.3よりも前からありましたが、擬似クラスや擬似要素、セレクタの連結など、用途が限られていました。 // Sass 3.3よりも前の「&」の用途の例 .foo { &:hover

    Sass 3.3で追加された「&」の新機能と@at-rootまとめ解説