すべての主要ブラウザで利用可能になったアットルール@starting-styleとは

2024/08/12 52 users プロパ 主要ブラウザ すべて 利用 要素

本記事では2024-08-06にリリースされた Firefox 129をもって主要なブラウザすべてで利用可能になったアットルール @start-style について紹介します。 トランジション開始時のスタイルを指定できる @starting-style @starting-style はトランジションされる要素に対して、CSS プロパティの開始値を定義するためのプロパ... 続きを読む

Next.js で Props をソートすると gzip 時のビルドサイズを少しだけ減らせる

2023/03/17 11 users Props gzip jsx 知見 Next.js

どういうこと？ 少し前に、CSS プロパティを自動ソートすると gzip 時のビルドサイズを減らせる記事を見ました 👇 これにならい、JSX の Props もソートしたら同じようになるんじゃね？って思って試したら、ビルドサイズを減らすことができたので、この場を借りてその知見を共有したいと思います 💪 検証環境 パッケージ... 続きを読む

img 要素に pointer-events:none; を指定すると、その画像を囲むリンクが効かなくなる件の回避方法 - Corredor

2018/05/17 13 users pointer-events None 経緯 img 要素

2017 - 03 - 31 img 要素に pointer-events:none; を指定すると、その画像を囲むリンクが効かなくなる件の回避方法 CSS3 CSS CodePen 経緯 画像をむやみに右クリックで保存されないようにするため、 img 要素に pointer-events:none; を指定した。 この CSS プロパティは、クリックや右クリックによるイベントを発火させなくするプ... 続きを読む

CSS Flexible Box を使ってみよう | WWW WATCH

2013/07/13 115 users WWW WATCH ウインドウサイズ CSS モジュール 通り

CSS3 のモジュールとして策定されている CSS Flexible Box は、CSS によるレイアウトを実現するための仕組み。 レイアウトのための CSS プロパティは他にもありますが、CSS Flexible Box は特にスクリーンサイズや可変するウィンドウサイズなどに柔軟に対応した、その名の通りフレキシブルなレイアウトが可能です。 現在最新の仕様書は下記。2012年 9月 18日付けで勧... 続きを読む

jQuery で要素の CSS のプロパティの値を取得する方法 | ウェブル

2011/02/21 17 users jQuery toggle プロパティ displ find

toggle() で開いた時と閉じた時にそれぞれ別のアクションを実行したい。しかし toggle() にそのような機能はないため、click() 時に要素の display プロパティの値を取得して、それを比較していろいろなアクションを実行することにしました。というわけで特定の CSS プロパティの値を取得するコード。1alert(j$(this).find(".more").css('displ... 続きを読む