画像を表示した後暗くしたい

Question

画面いっぱいに表示した画像（background-imageで指定しています）を、スクロールで表示された後暗くし、その上から文字をフェードインさせたいのですが、どのようにhtml、css、javascriptを書けばよいかわかりません。よろしければご教示お願い致します。

Comments

[yambejp]

命題のイメージが伝わってきません。
スクロールで表示→最初は表示されていなくてスクロールすると表示されるのでしょうか？
表示された後暗く→どのタイミングで暗くするのでしょうか？
表示された瞬間暗くするなら、最初から暗くしておけばいいでしょう。
また暗くするのは画像を暗くするのですか？ページ全体が暗くなるのですか？

> 上から文字をフェードイン

どのタイミングでどのようにしたいのでしょうか？

[mamenosuke]

お返事ありがとうございます。
スクロールされた後表示されるのではなく、画像が画面内に入ったらという意味でした。
また、画像を見せた後1秒後くらいに文字を見やすくするため画面を暗くしようとしていたのですが、デザインを鑑みても最初から暗くしていても大差ないように思えましたので、デザインを変更することに致しました。
お手数おかけしました。

Answer 1

デザインを変更致しましたので必要なくなりました。