戦後・復興期と現在の空中写真を重ねて比較してみた

最終更新日

昨日の続き。

leaflet clip example

example

Facebookにて、レイヤーを重ねて比較するサンプルコードを教えていただいたので、やってみました。
サンプルをちょっと弄っただけですが、一応Y軸にもスライドできるようにしてみました。
上のスライダーを動かすとY軸が、下のスライダーを動かすとX軸の表示領域が変わります。

重ねたレイヤーをcssのclip機能で切り抜いて表示・非表示を操作しています。

サンプル

ブラウザ間の違いを吸収する

ブラウザによって、使えるメソッドやプロパティが違うのですが、三項演算子を使って分岐させる方法をこのサンプルで初めて知りました。これ便利ですね。

JavaScript – ブラウザ間のメソッドやプロパティの違いを三項演算子を使って吸収する – Qiita