1. ホーム
  2. javascript

[解決済み] JQueryで:before cssセレクタのwidthプロパティを変更する [duplicate]

2023-07-18 01:38:17

質問

画像が入っているページがあり、:before CSS セレクタを使ってスタイル付けをしています。

画像は動的なものなので、固定幅ではありません。そのため、:beforeルールの幅を動的に設定する必要があります。

JQueryを使ってクライアント側で行いたいのですが。

これを想定して

.column:before{
    width: 300px;
    float: left;
    content: "";
    height: 430px;
}

.column{
    width: 500px;
    float: right;
    padding: 5px;
    overflow: hidden;
    text-align: justify;
}

でクラスの width プロパティだけを変更するにはどうしたらよいでしょうか? :before セレクタを持つクラスの幅のプロパティのみを変更することができます(そして、そうでないものはありません)JQueryを使用して?

どのように解決するには?

擬似クラスのルールに直接アクセスするjQueryの方法はないと思いますが、常に新しい style 要素を追加することができます。

$('head').append('<style>.column:before{width:800px !important;}</style>');

を参照してください。 ライブデモはこちら

また、この問題に取り組むプラグインを一度見た記憶があるのですが、残念ながら最初にググったときには見つけられませんでした。