Panda Noir

JavaScript の限界を究めるブログでした。最近はいろんな分野を幅広めに書いてます。

z-indexを心穏やかに使うための方針

z-indexを「なんとなく」で扱っていませんか?その結果

  • すべてのCSSを読まないと重なりについて理解できない
  • 最大値を探し出さないとつぎの要素を設定できない
  • z-index:100と設定する

といったことになったこと、ありませんか?z-indexという"""災厄"""とうまく付き合いたくありませんか?

ポイント: z-indexを「グローバル」に扱わない

z-indexを使っていて混乱するのは「グローバルに」扱ってしまっているからです。グローバル変数が悪というのは古から言われています。z-indexもグローバルに扱うことはもちろん握手です。

z-indexを「ローカルに」領域を区切って扱えると良いと思いませんか?実はできるんです!

続きを読む

Reactで<dialog>いじってみたけどつらい件

みなさん<dialog>要素を知っていますか?HTML5.2で追加された要素で、モーダルウィンドウをカンタンに実装できるステキ要素です。これをReactから使おうとしてみたのですが、Flux的なやり方ができなくて辛かったです。

…というだけの記事です。

この記事の環境

この記事は以下のバージョンのパッケージを使用しています。

  • React v16.7.0
  • Redux v4.0.1
  • TypeScript v3.2.2
  • TypeScript-FSA v3.0.0-beta-2
続きを読む

TABでの移動についてまとめてみた

たびたび「あれ?Chromeのタブ間移動ってどうだっけ?」「同じアプリのウィンドウ間移動って?」となるので、まとめました。

Ubuntu18.04用です。

キーボードショートカット 動作
Ctrl+TAB Chromeで次のタブへ移動
Super+TAB アプリ間を移動
Alt+TAB Super+TABと同じ
Alt+半角/全角 同一アプリでのウィンドウ移動
Alt+ESC ウィンドウを切り替える(同一アプリかに関係なく全てのウィンドウに対する操作)
Ctrl+数字 Chromeで、その番号のタブへ移動
Alt+数字 Chromeで、その番号のタブへ移動

調べてみると、意外にもTABを使ったショートカットが少ないことがわかります。

メールサーバー構築に四苦八苦したので記録

f:id:panda_noir:20190102120513j:plain

あけましておめでとうございます。今年もよろしくお願いします。

去年、メールサーバ構築・独自ドメインのメールアドレス作成(4/4)~メールサーバのインストール~ - Qiitaを参考にメールサーバーの構築をしたのですが、どうもうまく行かなかくて苦戦していました。新年になってようやく解決できたので、ここに構築手順を書き記しておきます。

続きを読む