0

ランディング ページのアニメーション スクロールをデザインしています。

私はframer.js の使用を楽しんでいますが、自分の Web ページにフレーマー レイヤーを配置するのが難しく、それらをブラウザーのサイズに反応させることができません。ブラウザのプロトタイプよりもモバイルのプロトタイプの方がうまくいくようです。

私の解決策は、html の div 内にフレーマー レイヤーを配置し、その div を私の css スタイリングに応答させることでした。残念ながら、私はこれへの道を見つけることができません。

jQuery を使用して、レイヤーを div に追加してみました。

app.js

var Container = new Layer({
  backgroundColor: "transparent",
  width: 400,
  height: 400
});

$(Container).appendTo(".vertical_center")

index.html

<body> 
   <div class="vertical_center"></div>
</body>

jQueryが機能していることを確認するためだけに、ランダムテキストを正常に追加しました。ウェブサイトに埋め込むことができる「アセット」を作成するために framer.js を使用した人はいますか? どうして？

4

1 に答える 1

0

かなり古いトピックですが、まだ解決策を探している場合は、プロトタイプを上書きできます..スクリプトの先頭に次のようなものを追加します。

Layer.prototype.__createRootElement = function() {
        var element;
        element = document.createElement("div");
        element.id = "FramerRoot";

        element.style['-webkit-perspective'] = 1000;
        element.style.position = "absolute";
        element.style.left = 0;
        element.style.top = 0;
        element.style.right = 0;
        element.style.bottom = 0;

        document.getElementById('wrapper').appendChild(element);
        return element;
    };

それを行う最良の方法ではありませんが、機能します。

于 2014-09-14T16:25:45.600 に答える