とあるソシャゲのHTML/CSS設計話
【Frontendアドベントカレンダー19日目】 Xboxに釣られて転職してから２年半…あっという間だった…。 関与したもの： スマホ版ピグ（リニューアルして面影無し） ピグファンタジア（11月末クローズ） 新規ゲーム ←今ここ 今は新規ゲームでコーディングの人としてjoinしてます。 新しいサービスを立ち上げる時に必要なHTMLとCSSの土台作りを全部やるということが、 「HTML/CSS設計」という言葉で装飾されることを知ったのは割と最近です。 マークアップだけで一人据えるのは珍しいと思うので、今やってることなど含めてつらつら書きます。 ここが変だよソシャゲ開発 依頼を受けてサイトを作る場合は次のようなフローだと思います： クライアントと打ち合わせ 仕様が決まる デザイン決まる 値切られる 価格が……決ま…る コーディング クライアントチェック 突然の無理難題に戦慄走る テスト・修正
[Sass] Sass 3.2で実装された新機能がヤバい
8/10に3.2、8/15にバグフィックスした3.2.1がリリースされて ただでさえヤバイくらい高機能なSassがますますパワーアップした。 Sass信者のみなさんはすでにお使いでしょうか？ 晒したソースはオンラインコンパイラで試せます。 jsdo.itも対応してます。 @content これはmixinにブロックコンテンツを渡せるようにする合言葉。 mixinを作る時、渡されたブロックコンテンツを入れたい場所に@contentを配置すると @mixin iphone { @media only screen and (max-width: 480px) { @content; } } @includeするときに波括弧で括ってコンテンツを渡せるようになる。 @include iphone { body { color: red } } コンパイルすればこのとおり、@mixinの内容＋渡した
![[Sass] Sass 3.2で実装された新機能がヤバい](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
[jQuery] スマートフォン・タブレットPCのユーザーエージェントと判別プラグイン
ユーザエージェント(userAgent)判別プラグインの焼き直しです。 スマホ判別に特化させてみた。 直接見る Usage $(document.body).checkSmartphone( [{option}] ); 対象にしたHTML要素にプラグインが得た情報に基づいたクラスを付与します。 $.browser.agent プラグインが生成した情報の格納場所。キーはプラグインのオプションと同じです。 判別ルールに関するメモ スマートフォンかそうでないかの判別 Androidがフリーダムだったので見直した。 加速度はAndroidの対応が微妙なので、現時点でuserAgent以外の何かを見るなら 傾きとタッチに関するプロパティやイベントの有無で判断するのが手っ取り早いと思います。 デバイスの確認 Android か Appleのやつか 傾きに関するプロパティ がある (‘orientati
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
