画像 遅延読み込み時のローディング画像をcssで指定したい。

Question

echo.js を使用しています。

こちらの遅延読み込みのプラグインのローディング画像の大きさや位置をCSSで指定したいです。

<!-- [data-echo]に画像のパスを指定 --> <img src="./dummy.png" data-echo="./image.jpg">

echo.jsは本来の画像を data-echoに置き srcにローディング画像を置くのですが、src=のローディング画像へCSSでの指定は可能でしょうか？

またその場合はどのような記述をすれば宜しいでしょうか？

imgのwidthを指定するとローディング画像もそれに合わせてサイズが変わってしまいます。

ローディング画像をimg要素の真ん中に置きサイズもオリジナルより小さく表示したいと思っております。

宜しくお願い致します。

Comments

[yoshinavi]

CSSの「background-size」で調整できないでしょうか？
※編集しました。

[fitzy]

img{
background:~px;
}
と指定しましたが反応致しません。

[yoshinavi]

単体指定の時は、「background-size」と記入してみてください。

[fitzy]

backgroound-sizeと記入しましたが反応致しません、お答え頂きありがとうございます。

[退会済みユーザー]

oが一個多いです

[fitzy]

実際の場所では構文ミスをしておりません。ご指摘ありがとうございます。

[kei344]

プラグイン／ライブラリは公式配布サイトのURLを質問文に追記ください。（URLにはリンクを張ることができます）また、ご自身で試された（状況を再現できる）コードを質問文に追記し、「何」が「どのように」わからないのか、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

[yoshinavi]

echo.jsをダウンロードして試してみました。「data-echo」の認識が間違っていました。スミマセン。
m( _ _ ;)m
「Lhankor_Mhy」さんの回答にあるように、属性セレクターで指定すれば任意に調整できます。

[fitzy]

ありがとうございます！

Answer 1

属性セレクタを用いればいいのでは？
属性セレクター - CSS: カスケーディングスタイルシート | MDN

中央に小さく表示するのには、パディングを指定するとか？

img[src*="dummy.png"]{
  width:50px;
  padding:50px;
}

Comments

[fitzy]

ありがとうございます。こちら指定してみます。