IE11ですべてのメディアクエリ内のCSSが瞬間的に適応されるため、transitionが効いてしまい色々動いてしまう問題について

http://neos21.hatenablog.com/entry/2016/02/09/000000

標題の件、上記にあるハックは使いづらい部分があるので、とある案件ではtransitionプロパティのみDomContentLoadedしたときのみに適応させることで対応した。

しかしこれは非常に面倒なことになりがちなので、CSS設計の段階でtransitionプロパティを最小限の利用(transition-propertyをallではなく、きちんと使うもののみ指定)する方針に固めたほうが望ましい。

またIE11ではtransformの値内でcalcファンクションが利用できなかったり、transform3dの動きがぎこちない、あるいは擬似要素にtransitionやanimationを適用するとカクカクしたりすることがあるため、IE11を重視する場合は擬似要素をアニメーション目的で利用せず、transformを2dまでのやり方で書く方が望ましい。

iOS10系のChromeでformat-detectionが有効にならないバグ

進行中案件にて発見。

昔使われていたUIWebViewはリンク化の制御を行わないとmetaタグのformat-detectionが有効にならなかったので、開発者側の制御も必要だった。
http://d.hatena.ne.jp/nakamura001/20110430/1304134585

今はよくわからないが、Chromeのみ標題のような現象が発生している。

具体的には、電話番号などがすべてaタグで囲まれている様子。

iOS9では発生せず、iOS10のみの現象である。

対策としてはaタグでもスタイルが壊れないように設定するしかない。。

WP-CLIでWordPressのデータ移行

PHPが入っていない場合は、インストール

$ sudo yum install php php-mysql

公式サイトからインストール(下記参照)
http://wp-cli.org/ja/

$ curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar

動作確認

$ php wp-cli.phar --info

wpコマンドで動作するように、実行権限付加+環境変数PATHに登録

$ chmod +x wp-cli.phar
$ sudo mv wp-cli.phar /usr/local/bin/wp

リセット

wp db reset

インポート

wp db import (インポートするSQLファイルのパス) && wp search-replace (インポート元ドメイン) (エクスポート先ドメイン)

エクスポート

wp search-replace (エクスポート先ドメイン) (インポート元ドメイン) && wp db export (エクスポートするSQLファイルのパス) && wp search-replace (インポート元ドメイン) (エクスポート先ドメイン)

Browsersyncで同じLAN内の人にローカルファイルを見せる

まずはBrowsersyncをインストール

npm install -g browser-sync

これでローカルのパスを指定すると勝手に始まる

browser-sync start --proxy "192.168.33.12"
browser-sync start --proxy http://localhost/~

※デスクトップとかのパスでもOK。ExternalのURIからほかのブラウザで閲覧できる