Firefox 39 が正式リリース、CSS Scroll Snap Points のサポートなど

Firefox の最新版、Firefox 39 が正式リリースされ、自動更新も提供開始されました。Android 版も同時公開。list-style-type プロパティの値に文字列が指定できるようになった他、CSS Scroll Snap Points のサポートなどが行われています。

Firefoxここ最近 Blog の更新サボりすぎて、Firefox のアップデート情報しか書いていない気もしますし、Firefox 39 のリリースからもうかなり時間経っちゃってるんですが...... とにかく、Firefox の最新版、Firefox 39 が正式リリースされ、自動更新も提供開始されました。Android 版も同時公開。

CSS 関連では、list-style-type プロパティの値に <文字列> が指定できるようになった他、CSS Scroll Snap Points のサポートが行われ、例えばタッチデバイスにおけるスワイプ操作などで行われる要素の上下左右へのスクロールの挙動を細かく制御することが可能になりました。

Firefox 39

CSS Scroll Snap Points

仕様書に掲載のサンプルソースを例にして簡単に説明しますが、例えば、横幅 500px の画像を横一列に並べた上で、overflow プロパティを使って、左右にスクロールして次々に画像を見ることができるフォトギャラリーがあったとします。

<div class="photo-gallery">
  <img src="img1.jpg" />
  <img src="img2.jpg" />
  <img src="img3.jpg" />
  <img src="img4.jpg" />
  <img src="img5.jpg" />
</div>

CSS は例えば下記のような感じ。

img {
  width: 500px;
}
.photo-gallery {
  width: 500px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scroll-snap-points-x: repeat(100%);
  scroll-snap-type: mandatory;
}

scroll-snap-points プロパティを使用することで、100% (つまり上記の指定だと 500px) ごとにスクロールがスナップしてくれるようになります。例えば左右にスワイプしたときに、前後の画像でうまいことスクロールが止まってくれるため、この手のギャラリーの操作性が向上します。

list-style-type プロパティ

list-style-type プロパティの値に <文字列> が指定できるようになりました。これによって、下記のように、リストマーカーに任意の文字列を指定することが可能です。

ul {
  list-style-type: "★";
}

例えば上記のように指定することで、リストマーカーを 「★」 にすることができます。

その他、セキュリティアップデート

緊急 4 項目を含む、計 13 項目のセキュリティアップデートが行われています。Firefox 39 で行われたセキュリティアップデートについて詳しくは下記のページを参照してください。

関連エントリー

記事をここまで御覧頂きありがとうございます。
この記事が気に入ったらサポートしてみませんか?