記号(:や/)が連続するとword-bleak: break-all;の折り返しが効かない

最近知ってしまった真実…
一部のブラウザで、CSSの強制折り返しが効かないケースがあることがわかりました。

* {
	word-bleak: break-all;
}

こうしときゃ万能だろうという神話を信じていたのに、:(コロン)や/(スラッシュ)が連続している場合は折り返してもらえません。

2016年11月2日現在ではこうなっていました。

  • Safari 10.0.1 … OK
  • Chrome 54.0.2840.71 … NG
  • Internet Explorer 11 … NG

“記号(:や/)が連続するとword-bleak: break-all;の折り返しが効かない” の続きを読む

カラーコードの色を表示してくれるAtomのpigmentsが便利

2016年から、エディターをSublimeTextからAtomへ変えているのですが
その中でもすばらしいのが、プラグインのpigmentsです。

pigments

Atomで初期インストールするプラグインの記事をみても、軒並みエントリーされているプラグインなので
今更私がここで言うのもおこがましいのですが
とりあえず入れてみたら、これが便利でびっくり!

インストール方法や、機能説明については
既存ですばらしい紹介がたくさんあるので、割愛させていただき
クライアントワークで活用してみて、具体的にどんな場面で素晴らしいと感じたか簡単にまとめてみました。

そう、便利なんだけど、実際には全部の機能は使いこなしていないです。
Show Paletteも良さそうだけど、最初に「おー!」と開いたきりでした。

“カラーコードの色を表示してくれるAtomのpigmentsが便利” の続きを読む

currentTargetで無名関数を使わずイベントターゲットを取得

たとえば、jQueryでイベントを設定するとき、こんな書き方をしたことはありませんか?

// フォーカスが外れると改行を削除する
var deleteLinefeed = function(obj) {
	var v = obj.val();
	v = v.replace(/¥n/g, '');
	obj.val(v);
};
$('textarea').on('blur', function(){
	deleteLinefeed($(this));
});

この無名関数が冗長で気になる!
なにより、無名関数で紐付けたら、イベントリスナーを削除しにくいです。

そこで、イベントオブジェクトのcurrentTargetを活用すると
このようにスッキリさせられます。

// フォーカスが外れると改行を削除する
var deleteLinefeed = function(e) {
	var obj = $(e.currentTarget),
	v = obj.val();
	v = v.replace(/¥n/g, '');
	obj.val(v);
};
$('textarea').on('blur', deleteLinefeed);

currentTargetで取得するのは、イベントを紐付けてあるオブジェクトです。
これと似たtargetでは、イベントを発動させたオブジェクトを取得できます。

参考:
三章第五回 イベントオブジェクト — JavaScript初級者から中級者になろう — uhyohyo.net

Adobe Illustratorで大量のSVGサムネールを書き出す

画像化された文字の見出し、カード型のサムネールや、かるたなど
同フォーマットで文字違いのSVG画像をIllustratorで大量に書き出す場合のコツを紹介します。

基本的には、SVG保存で選べる「アートボードごとに作成」での一斉出力なのですが
アートボードパレットの機能も活用すると、画像を複製してたくさん作る作業もかなり楽になることがわかったので、そちらのほうも紹介します。

サンプルとして、この47都道府県のカードを作ってみました。
コツをつかめば、だいたい20分で作ることができます。

北海道
青森県岩手県宮城県秋田県山形県福島県
茨城県栃木県群馬県埼玉県千葉県東京都神奈川県
新潟県富山県石川県福井県山梨県長野県
岐阜県静岡県愛知県三重県
滋賀県京都府大阪府兵庫県奈良県和歌山県
鳥取県島根県岡山県広島県山口県
徳島県香川県愛媛県高知県
福岡県佐賀県長崎県熊本県大分県宮崎県鹿児島県
沖縄県

“Adobe Illustratorで大量のSVGサムネールを書き出す” の続きを読む

HomebrewでインストールしたnodebrewではNode.jsやnpmが使えない

HomeBrewでnodebrewをインストールし、そのnodebrewからNode.jsをインストールすると
nodebrew上ではインストールが成功しているのに、実際にはNode.jsとnpmがインストールされない不具合があります。

よし!インストールできた!

$ nodebrew list
v6.1.0

current: v6.1.0

んん?!!

$ node -v
-bash: node: command not found

“HomebrewでインストールしたnodebrewではNode.jsやnpmが使えない” の続きを読む

ターミナルの設定ファイル.bash_profileを設置する

.bash_profileは、Macのコマンドラインツール、ターミナルの設定ファイルで
ユーザがログインした時に一度だけ読み込まれます。

ここにコマンドを入力しておくと、ターミナルを立ち上げた時点で初期設定として実行してくれているイメージでしょうか。

.bash_profileは最初はないので、自分で設置しなければいけません。

“ターミナルの設定ファイル.bash_profileを設置する” の続きを読む

バージョンの違うMySQLでmysqldumpエラーを防ぐ

mysqldumpでバックアップしたデータベースを、バージョンの違うMySQLサーバでリストアしようとしたら
シンタックスエラーで停止してしまうことがあります。

mysqldumpは、MySQLのバージョンが変わるとバージョンによっては互換性が失われることがあリます。
その場合は、古い環境に互換性のある形式でdumpし直すと解決できます。

“バージョンの違うMySQLでmysqldumpエラーを防ぐ” の続きを読む