css PCで背景固定演出→スマホでは背景普通演出にする方法

よくページをスクロールすると背景だけがスクロールされず固定される演出ありますよね。サイトに奥行きが表現されて私も大好物の演出です。
ですがこの背景を固定するcss、スマホ用にレスポンシブした場合はなぜか効かないんですよね…。
それができれば問題ないのですが、今のところ方法が編み出せないので…。
「PCでは背景を固定する演出」を「スマホではを普通演出に(スクロール)」させる方法の紹介です。

cssにPCバージョンの要素とスマホの要素を2つ記入。

スマホで背景固定演出すると、どうしても背景画像が大きく映り込んでしまうんですよね…なのでその回避方法です。

関連記事