https://jp.techcrunch.com/2015/03/14/20150313readme-creates-crisp-documentation-for-developers-using-your-apis/
[CSS]OS X Yosemiteのように背景が透ける美しいパネルを実装するスタイルシート
昨日発表された2014年秋リリースのOS X 10.10 Yosemiteで採用予定の背景を半透明のブラーで透けさせる美しいパネルを実装するスタイルシートを紹介します。 記事は一日遅れですが、スタイルシートは当日で、仕事が早いですｗ OS X Yosemite Style UI ※Chrome, Safari, Firefox, IE11でどうぞ。 コードは、簡略化するとこんな感じになります。 実際のコードは上記ページを参考にしてください。 HTML タイトルのバーとコンテンツをdivで実装し、articleで内包します。 <article> <div class="title"> <h1>タイトル</h1> </div> <div class="content"> <p>コンテンツ</p> </div> </article> CSS 半透明のパネルのスタイルシートです。 *, *:aft
[CSS]実装のアイデアが面白い！枠線から背景をずらして配置するスタイルシート
枠線から背景をずらして、ゆる〜い感じにデザインされたスタイルシートを紹介します。 HTMLはbutton要素一つで実装されており、二つの要素をマイナスマージンで強引に重ねるとかの荒技ではないです。 デモページ 実装は、こんな感じです。 HTML button要素一つで実装します。divなど他の要素に変更してもOKです。 色の違いはclass指定で。 <button class="yellow"> View More </button> <button class="blue"> View More </button> CSS 枠線は通常通りbutton要素にスタイルし、ずらした背景は疑似要素の:afterを使います。 ちょっとだけ傾けるのがポイントです。 body {width:70%;text-align:center;margin:40px auto;} button { positi
Webプラットフォームは複雑になりすぎていないか？ HTML5仕様のキーパーソン、Hixieへのインタビュー（中編）
Webプラットフォームは複雑になりすぎていないか？ HTML5仕様のキーパーソン、Hixieへのインタビュー（中編） HTML5の登場は、Webのあり方を一変させようとしていると言っても過言ではないでしょう。その仕様策定はW3CとWHATWG（Web Hypertext Application Technology Working Group）が共同で行っています。 そのHTML5仕様策定のエディタ、Ian Hickson氏、通称Hixie（ヒクシー）に、同じくHTML5界の著名人であるオペラのBruce Lawson氏がインタビューした記事「Interview with Ian Hickson, HTML editor」を許可を得て日本語訳しました。 本記事は「なぜHixieはいつも“ノー”と言い続けるのか？ HTML5仕様のキーパーソン、Hixieへのインタビュー（前編）」の続きです。
ギーク都市伝説「WebSocketは鉄道模型をコントロールするためのものだった？」 HTML5仕様のキーパーソン、Hixieへのインタビュー（後編）
ギーク都市伝説「WebSocketは鉄道模型をコントロールするためのものだった？」 HTML5仕様のキーパーソン、Hixieへのインタビュー（後編） HTML5の登場は、Webのあり方を一変させようとしていると言っても過言ではないでしょう。その仕様策定はW3CとWHATWG（Web Hypertext Application Technology Working Group）が共同で行っています。 そのHTML5仕様策定のエディタ、Ian Hickson氏、通称Hixie（ヒクシー）に、同じくHTML5界の著名人であるオペラのBruce Lawson氏がインタビューした記事「Interview with Ian Hickson, HTML editor」を許可を得て日本語に訳しました。 本記事は「Webプラットフォームは複雑になりすぎていないか？ HTML5仕様のキーパーソン、Hixieへ
プレゼン用のスライドショーを実装する、わずか1KBなのに多彩なエフェクトを備えタッチデバイスにも対応したスクリプト -Bespoke.js
コンカーブ 凹状に配置したパネルをスライドします。 Bespoke.jsの使い方 スライドショーの実装は簡単で、3ステップです。 Step 1: HTMLと外部ファイル スタイルシートとスクリプトを外部ファイルとして記述し、各パネルはsection要素で実装し、articleで包みます。 スタイルシートはテーマごとに変更します。 <link rel="stylesheet" href="path/to/my/theme.css"> <article> <section>Slide 1</section> <section>Slide 2</section> <section>Slide 3</section> </article> <script src="bespoke.min.js"></script> <script src="path/to/my/script.js"></scri
Canvas APIの基礎
もともと、Appleが主にDashboardウィジェットの描画のためにWebKitに導入したCanvas API。サンプルコードと見比べながら、効率良く学習しよう Canvas APIの基礎 本連載では、Webブラウザ上で利用できるグラフィック技術を分かりやすく紹介しています。今回はHTML5のcanvas要素で使える2次元描画コンテキスト、俗にいう「Canvas API」を取り上げます。 Canvas APIは、もともとAppleが主にDashboardウィジェットの描画のためにWebKitに導入したものです。それがFirefoxやOpera、Internet Explorer（9以降）に実装され、現在はW3Cによって標準化が進められています。JavaScriptのメソッドで直接図形を描画するのが特徴で、ビットマップ画像の加工や、ゲームのようなインタラクティブ性の高いアプリケーションに向
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
