サポート » プラグイン » パララックスがiPhoneやiPadで効かない

  • 解決済 hachikuma

    (@hachikuma)


    パララックス効果をトップページのメイン画像にだけつけたのですが、iPhoneやiPadでみると効いてないのです。これについて調べるとそういうものだとのこと。何か代案はないでしょうか?
    WORDPRESSだからプラグインでもあればと思ったのですが、Parallax Imageというプラグインを入れてみたのですが、説明サイトがなくてわかりませんでした。

    どなたかご教授ください。
    よろしくお願いします。

    ●使用テーマ「YUUTA」
    ●現在のパララックスのソース
    【HTML】※画像の上にテキストやボタンを重ねてます。

    <div class="top_box">
        <div class="top_text1">テキスト1</div>
        <div class="top_text2">テキスト2</div>
        <div class="top_text3">テキスト3</div>
      <div class="top_mainbutton" id="about2">
      <div class="mainbutton"><a href="#entryform" class="btn-border">フォームはコチラ</a></div>
      </div>
    </div>
    

    【CSS】

      .top_box{
        background-image: url("image.jpg");
        background-repeat:no-repeat;
        background-attachment: fixed;
        position: relative;
        text-align: center;
        background-size:cover;
        width:100%;
        height: 100vh;
      }
    
2件の返信を表示中 - 1 - 2件目 (全2件中)
  • DRILL LANCER

    (@rickaddison7634)

    Parallax Imageのサイトを見に行くと、

    For example:

    以下に説明が書いてあります。
    要は

    [dd-parallax img="imagename.jpg" height="600" speed="3" z-index="-100" mobile="mobile-image.jpg" offset="true"] 
    
    Text to be overlaid on the paralllax window
    
    [/dd-parallax]

    のショートコードの中にパラメータを指定して、表示させたいテキストを挟めということなのでしょう。
    理解できない場合は Google 翻訳などを活用してみるのも手かもしれません。

    RICKさん、ご回答ありがとうございます。

    Parallax Imageの使用法少し理解できました。
    もう一度やってみたところ、iphoneやiPadでは今まで背景画像がうまく表示できてなかったのですが、表示できました。しかし、パララックス効果はiphoneやiPadでは機能してくれませんでした。

    最悪はこのままiphoneやiPadはパララックスなしにしてもいいかな、とは思ってます。

    ありがとうございました。

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • トピック「パララックスがiPhoneやiPadで効かない」には新たに返信することはできません。