[B! css][safari] usako1124のブックマーク

iOS（Safari）でスクロールバーを常に表示したい...CSSだけでは表示できない！？

スマホ閲覧時に画面からはみ出したテーブル要素などを横スクロールで表示する事がありますが、このスクロールバーを常に表示できないか？という内容です。以前までのiOSのバージョンならCSSの「-webkit-scrollbar」というプロパティを使うだけで簡単にスクロールバーを常に表示出来たのですが、新しいiOSでは消えてしまうようです。 CSSではダメなのでJavaScript（jQuery）で何とかできないか考えました。 iOS(Safari)でスクロールバーを常に表示するスマホなどの画面が小さいデバイスに対して、テーブル要素などの横長の表のようなコンテンツを表示する時には横スクロールが良く使われます。表を横にスクロールできることは周知されている動作だとは思いますが、いい感じに画面の端で表がピッタリ切れていると自分で見ても横にスクロールできるのかどうか分からない事があります。そこでCS

usako1124 2023/03/22

リンク

https://twitter.com/makinko/status/1346103710733123605

usako1124 2022/08/31

リンク

apingが万能だと思ったらそうじゃなかった話

web上で使用するアニメーションは、楽をしてgifで作成していたのですがapingがかなり使えるという記事を発見し、早速使用してみた。 gifは輪郭がなめらかにならなかったり、透過に難ありだったり（アルファチャンネルがサポートされていない？）、色数に制限があったりするため、実際に使用する際はある程度の画質劣化を覚悟した上で使用していたのだが、そういった枷をぶちとばして使用できるのがapngである。 LINEスタンプでもアニメーションのあるものが出ているが、これらもapng形式にて作成されているらしい。ということで実際に使用してみるとおどろき、データサイズも軽いので今後はapngでいくしかねえ〜と思った。が、safariで動作チェックをしてみると「画像の色が時たま反転する・色がおかしくなる」という不具合が…。同様の事象がないかと検索をかけてみたが、特に困っている方のページは出てこず。

usako1124 2022/08/31

リンク

GIFアニメからAPNGの時代に！次世代画像形式APNGを使いこなそう - ICS MEDIA

APNG（エーピング）とはアニメーションするPNG画像のことで、アニメーションGIFに取って代わる次世代の新しい画像形式です。もともとブラウザベンダーのMozillaが提案した規格で、ウェブサイトのアニメーション表現に利用できます。従来はアニメーションGIFが主流でしたが、アニメーションGIFは色数の制限や輪郭のジャギーなど品質面の制限が多いファイルフォーマットです。その制限を払拭してくれると期待されるのがAPNG形式です。データ容量・品質から比較する画像形式〜APNGは容量が軽くて綺麗上図ではアニメーションGIF・APNG(8bit・32bit)・PNG連番画像をデータ容量・データ品質でマトリクス図にしました。APNG 8bitはアニメーションGIFと同じ256色のサポートなのでAPNG 8bitの方がデータ容量は若干小さいものの、差はほとんどありませんでした。APNG 32bitは