2011-01-01から1年間の記事一覧
あとで自分のブログでも書きたいのでまとめておく。 とりあえずこのあたり見とけば大丈夫っぽい。WD (仕様) http://www.w3.org/TR/css3-3d-transforms/ED (仕様) http://dev.w3.org/csswg/css3-3d-transforms/MDN (仕様) https://developer.mozilla.org/en/C…
HTML と CSS は HTML5 Boilerplate をベースにした。 デザインに画像は使わなかった。 小さい画面向けのスタイルを書いて、@media で大きい画面向けのスタイルを追加していくのは予想以上に大変。 投稿のサムネイル画像は横幅が 300px より小さくなるように…
jQuery Lifestream http://christianv.github.com/jquery-lifestream/見てて面白いなーと思ったので、はてなブックマークも表示してみた。 他のサービスの取得方法がいっぱい書かれてるのでほとんどコピペですけどね……。 (function($) { $.fn.lifestream.fee…
ウィンドウが非アクティブになったりしたときに自動保存されるのを停止したい。 そういう場合の設定。Setteings -> IDE Setteings -> General -> Synchronization の中にある Save files on frame deactivation のチェックを外す。 ちなみにそのすぐ下の Sav…
なんか今さらですけど、気になったので試してみた。 var id = $('#test'); より var test = document.getElementById('test'); id = $(test); のほうが速い(みたい)。試したのはこれ。 http://jsperf.com/jquery-id
使いやすいと思った順に並べてます。 Ceaser - CSS Easing Animation Tool - Matthew Lein http://matthewlein.com/ceaser/ cubic-bezier.com http://cubic-bezier.com/ Visualize and manipulate CSS transition functions http://cssglue.com/cubic CSS cu…
http://msdn.microsoft.com/en-gb/ie/hh272902.aspx#_CSSTextShadowIE10 の text-shadow には spread distance の値があるみたいです。 ということは h1 { font: 18px bold; color: white; text-shadow: 0 0 0 2px black; } で擬似縁取りできたり h1 { font:…
今更な話題。 <ul> <li>List Item</li> <li>List Item</li> <li><del>List Item</del></li> <li><ins>List Item</ins></li> </ul> じゃなくて <ul> <li>List Item</li> <li>List Item</li> <del><li>List Item</li></del> <ins><li>List Item</li></ins> </ul> こうしたいなあと思いましたです。
WordPress のプラグイン WordPress Related Post for Japanese はとても便利なんですが、カスタム投稿タイプを使っている場合、そっちも対象としてしまうんですね。画像だけのカスタム投稿と普通の記事が混ざった状態で関連投稿が出たりするのはアレな気がす…
http://unformedbuilding.com/demo/test/ub/2011-07-01/HTML <html> <head> <meta charset="UTF-8" /> <title>2011-07-01</title> <link rel="stylesheet" type="text/css" media="screen" href="style.css" /> </head> <body> <h1 id="タイトル">Heading 1</h1> <p class="リンク"></p></body></html>
原文を読んだほうが早いかもしれないｗ Part1: http://www.1stwebdesigner.com/design/20-reasons-your-design-sucks-1/ Part2: http://www.1stwebdesigner.com/design/20-reasons-your-design-sucks-2/ 配置のバランスが悪い 使い方を分かっていないベベル…
ときどき gradient() なんかで詰まる人がいるようなので。CSS Color Module Level 3 を読めば分かりますが、 transparent は rgba(0, 0, 0, 0) と考えたほうがいいです。 Fully transparent. This keyword can be considered a shorthand for transparent bl…
今話題の CSS LINT (http://csslint.net/) ですけども。 チェックすると warnings で "Don't use IDs in selectors" って出るんですね。理由を見てみるとこんなことが書かれていました。 IDs shouldn't be used in selectors because these rules are too ti…
一応メモっておこうと思う。ウィンドウのサイズを教えてくれるやつ。便利。 http://www.josscrowcroft.com/2011/code/window-size-bookmarklet/見ているページをついったーにポストするとき用。コメント入れられるようにスラッシュ付き。 javascript:(functi…
http://d.hatena.ne.jp/ub-pnr/20110601/1306908663 がどうこう書いてたら @azu_re さんに 「DateをtoStringした結果。表示形式を変えるなら、まあ普通にdate.get*を使うべきですね。」 (http://twitter.com/azu_re/statuses/76518398930067456) と言われた…
画像 URL が入った配列があるとする var images = ['url1', 'url2', ...]; これを表示するとき、1枚ずつではなく、全ての画像のロードが終わってから表示したい。 たとえば div#gallery 内にリストで表示する場合、 var $ul = $('<ul/>').appendTo('div#gallery')</ul/>…
picplz API では投稿時刻が UNIX time になっているので人間にも読めるようにする。 曜日と GMT 表示はいらないので消す。Jun 01, 2011 12:40:31 みたいにしたい。 function convertTime(u) { var t = new Date(u * 1000); t.setTime(t.getTime() + (60 * 60…
現在の API で取れる Interesting の画像は240枚までっぽい。 feed.json の更新時刻は分からない。
API ドキュメントには To help guide you here are the formats we have pre-generated: Square Thumbnails: 56px, 64px, 75px, 100px, 200px Longest Side: 150px, 320px, 640px, 1024px と書かれているけど、 Longest Side は 400px (400r) でも取れる。 …
フリーカーソルっていうの？ あれがすごく苦手というか気持ち悪いので、 カーソルが行末にあるときに → を押したら次の行頭に移動するようにしたい。IDE Settings > Editor - Virtual Space > Allow placement of caret after end of lineのチェックを外せば…
http://api.picplz.com/api/v2/feed.json interesting 一覧の取得先 http://api.picplz.com/api/v2/user.json ではないuser.json はユーザー(単/複)を取るときに使う。 feed.json は network 取得にも使うが、こっちは認証が必要。公式プラグイン使えばいい…
Consolas に VL Gothic をフォントリンクしたものを使いたいがどうにも上手くいかない。 英数部分は Consolas になるけど日本語部分はよく分からないフォントになる。そこで、いったん MigMix 1M などの日本語等幅フォントを指定して、WebStorm を終了、再起…
無駄が多い気がする。 jQuery(function ($) { var $years = $('.year-select').children(), $yearLists = $years.children('li'), $selectYear = $yearLists.children('a'), $months = $('.monthly-archives').children(); var singleHeight = $yearLists.he…
html { overflow-y: scroll; }
思いついたのをぱぱっと書いておけるものが欲しかったので作った。 デザインは適当なので気が付いたら直していく(つもり)。
Arial とかメイリオだと分かりやすいかもしれない。 これ書いてたときに気付いた。 .class { text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.2); } これを直すには .class { text-shadow: 0 0 0 transparent, -1px -1px 0 rgba(0, 0, 0, 0.2); } と、シャドウの…
