[ゆうと]

【お使いの Snow Monkey のバージョン】25.1.5
【お使いの Snow Monkey Blocks のバージョン】20.3.0
【お使いの Snow Monkey Editor のバージョン】9.3.0
【お使いのブラウザ】chrome

連続の質問で大変申し訳ありません。

どうしてもわからないのでお願いします。

### 実現したいこと

セクション(背景画像)の背景画像を、スクロールした際も固定されるようにしたい。

具体的にはこちらのサイトのヘッダー画像のように背景画像を固定したいです。

SERVICE

サービス一覧 Webサイト制作 LPやコーポレートサイト、ブログなど、目的に応じた適切なコーディングを行います(レスポンシブ対応可)。Wordpressサイトの構築や既存サイト…

be-driven.jp

### 発生している問題

調べたところ、背景画像を固定するには以下のCSSが有効である事を確認しました。

background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;

セクションブロックにクラス名をつけ、上記のCSSをあてましたが背景が固定されていません。

### 試したこと

試した事①

先ほどのURL(https://be-driven.jp/service/)のコードを検証画面にて確認しました。

やはり同じCSSが書かれており、原因の特定はできませんでした。

 

 

試したこと②

パララックスの設定

上記のスクショのブロック名にhas-parallaxというクラス名が付与されておりました。

このパララックスが何か関係あるかと思い、セクションブロック→メディア設定→パララックス(非推奨)をオンにしましたが特に変化はありませんでした。

 

Googleでの検索、フォーラムでの検索も行いましたが答えに辿りつけませんでした。

お手数ですがよろしくお願い致します。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

確認したところ、「パララックス」の設定に不具合があるようです。後日確認しようと思いますが、基本的にはこの設定はページの表示速度が遅くなる非推奨の古い機能なので、例えばカバーブロックと組み合わせるのはどうかなと思いました。

カバーブロックは「背景固定」の設定があるので、カバーブロックに背景画像と背景固定を設定して、その中に普通のセクションブロックを入れると背景画像があるセクションを擬似的に再現できるかなと思います。

♥ 3

いいねをした人:

[ゆうと]

きたじまさん

お返事ありがとうございます。

なんと、ワードプレスの中に再現できるブロックがあったのですね！

ググり不足で大変申し訳ありません。

今回も解決できましたのでクローズさせて頂きます。

いつも本当にありがとうございます！

♥ 1

いいねをした人:

[キタジマ タカシ]

確認したところ、「パララックス」の設定に不具合があるようです。

閉じたあとですみません、ゆうとさんのサイトをみてパララックスの js がエラーを出していたので上記のように書いたのですが、修正しようと思って今僕の環境2つで試してみたらエラーは出ずに普通にパララックスになってしましました…。ということで何らかの設定等の組み合わせで発生する問題なのかもしれません。

また今度試すことがあって、うまくいかないときは教えてください！

♥ 0

いいねをした人: 居ません

[投稿者]

投稿