タグ

2014年12月5日のブックマーク (10件)

  • Mixins for Rem Font Sizing | CSS-Tricks

    The rem font-size unit is similar to em, only instead of cascading it’s always relative to the root (html) element (more information). This has pretty good modern browser support, it’s just IE 8 and down we need to provide px fallbacks for. Instead of repeating ourselves everywhere, we can use a LESS or SASS mixins to keep it clean. These mixins assumes: html { font-size: 62.5%; /* Sets up the Bas

    Mixins for Rem Font Sizing | CSS-Tricks
  • 2014年総まとめ、jQueryのプラグインとスクリプト100選

    毎年末にjQueryのプラグインをまとめていましたが、今年はプラグインの他に単体で動作するスクリプトも加えて、jQueryのプラグインとスクリプトの総まとめとして記事にしました。 今年目立ったのは、去年から引き続きアニメーション系、縦長ページ用のスクリプトでしょうか。 1カラムのレイアウトが流行っているためか背景関連も充実していました。それとSVGをより簡単に利用できるようになったのも大きな目玉ですね。 また、jQueryに依存しない、単体で動作するスクリプトも多く開発されるようになったと思います。 背景関連 SVG関連 縦長ページ関連 スクロール連動・パララックス関連 その他スクロール操作・補助関連 レスポンシブ関連 ナビゲーション関連 レイアウト関連 コンテンツ生成関連 コンテンツ紹介・ツアー関連 スライダー・カルーセル関連 画像拡大・配置・キャプション関連 アニメーション関連 エフェ

    2014年総まとめ、jQueryのプラグインとスクリプト100選
  • Sassでの関数の再帰呼び出し

    ちょっとした事情で20回ほど再帰呼び出しする関数をSassで書いたらコンパイラーが落ちた。これは単に関数にバグがあっただけだった。100回程再帰呼び出しする関数を書いてみたが、これは落ちた……と思ったらこれも間違えて無限ループさせてただけだった……。ちゃんと書いてちゃんと限界を確認した。 以下のようなテスト・コードを書き、$maxを書きかえて限界を探った。 $initial: 0; $max: 302; @function loop($i) { $i: $i + 1; @if ($i < $max) { @return loop($i); } @else { @return $i; } } .test { z-index: loop($initial); } コンパイラーが落ちず、出力されるCSSでz-indexプロパティーの値が$initial + $maxと等しくなれば良い。手元の環境

    Sassでの関数の再帰呼び出し
  • schoo(スクー)

    授業は双方向 授業は双方向ライブコミュニティ。ユーザーのコメントで授業が変化するので常にオリジナルです。コメントはしなくても大丈夫です。

    schoo(スクー)
  • clip と transform との組み合わせ - 職業プログラマの休日出勤

    この記事は SVG Advent Calendar 2014 の1日目の記事です。 SVG とは? SVG Advent Calendar の初日ということで、簡単に SVG そのものの紹介をしておきましょう。 WikiPediaの記事 → http://ja.wikipedia.org/wiki/Scalable_Vector_Graphics SVG 1.1 Second Edition の厳密な定義 → http://www.w3.org/TR/SVG/(英語) 手書きする人向けの日語での解説 → http://www.h2.dion.ne.jp/~defghi/svgMemo/svgMemo_01.htm なお、この記事には SVG画像 を直接記述しています。ブラウザによっては正しく表示されないことがあるかもしれません。特に古いやつとか。予めご了承下さいませ。 実演に使う画像 こ

    clip と transform との組み合わせ - 職業プログラマの休日出勤
  • プロトタイピングと仮デザイン指針 - mizchi's blog

    プロトタイピングにあたって考えたこと プロトタイピングの目的を損ねない 目的: 機能性の担保 以上の目的にあわないものは優先度を落とす やりすぎると実装の邪魔 どこからどこからが機能性? ユーザー目線で: UIを通して画面に副作用が起きること 開発者視点で: 内部の論理モデルが正しく動くこと デザインとの境界領域 レイアウトや余白の間隔は、機能としての実現性に直結するので機能に含む できるだけテキストボタンじゃなくてfont-awesomeとかを使う アイコン選定は適当でいい(どうせ変えられるし) レスポンシブは難しいので最初に真面目に設計する or 最初は一切考えない 実装者のCSS習熟度によるけど最初は固定幅とかが楽 開発中の未定義領域 ドッグフーディングで感じた小さい不満はその場で直す。プロトタイピング中に感じたものはたぶん正しいという前提 たとえば、ローディングアニメーションや確

    プロトタイピングと仮デザイン指針 - mizchi's blog
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 2014年のトレンド振り返り(2)·セキュリティ MOONGIFT

    前回分はこちら。 デザイン 今回はセキュリティについて振り返ります。 インシデント 今年はOSS周りのインシデントが目立った気がします。特に大きかったのはOpenSSL、Shellshock、SSLではないでしょうか。とはいえ、OpenSSLについては運営資金も乏しく、開発体制も少なかったため、起こるべくして起こった問題と言えます。これはネットに関わる企業、個人全員の問題です。 Shellshockもずっと昔からあった脆弱性にも関わらず放置されていたわけで、誰が悪いというわけではありません。オープンソースに対するコントビュートについて考えさせられますね。 Fingerprint Canvasタグを使って生成された署名はブラウザ固有のコードを生成します。そのためCookieと同じようにブラウザ追跡に利用ができます。しかもCookieと異なり、拒否もできません。 シークレットモードにしてもコー

  • これはすごい!3秒でプログラミングが始められるサービス17選 - paiza開発日誌

    Photo by Jason Cartwright こんにちは。谷口です。 プログラミングの勉強で「ちょっとあの開発言語の勉強をしてみたいな~」「実際にコードを書いて動かしてみたいな~」という時に、ハードルとなるのが「実行環境の作成」だと思います。 そんな時に役立つのが、書いたコードをブラウザ上で実行できる「オンライン実行環境サービス」です。 今回は、実行環境の手間を省いて「書いたコードをブラウザ上で実行できる無料サイト」を紹介します。 目次 ・複数言語対応系 ・ideone ・CodePad ・paiza.io ・repl.it ・Codecademy ・runnable ・Wandbox ・SourceLair ・JavaScript系 ・JSFiddle ・jsbin.com ・Codepen ・jsdo.itPHP系 ・PHPfiddle ・PHP Sandbox ・Write

    これはすごい!3秒でプログラミングが始められるサービス17選 - paiza開発日誌
  • [速報]Dockerが分散アプリケーションのオーケストレーション機能を発表。Docker Machine、Docker Swarm、Docker Compose

    Docker Machine、Docker Swarm、Docker Composeの3つの機能を組み合わせることで、Dockerの環境がない状態から、Docker環境を構築し、分散アプリケーションのための動的なクラスタを構成し、そこへアプリケーションをデプロイすることがすべてコマンドと構成ファイルによって実行できるようになります。 これによって分散アプリケーションが簡単にクラスタ環境ごとポータブルになり、かつ動的な構成と運用が容易になると説明されています。

    [速報]Dockerが分散アプリケーションのオーケストレーション機能を発表。Docker Machine、Docker Swarm、Docker Compose