1

視差スクロールを試していますが、次のようなことをしたいと思います。

$('.page').each(function() {
    $(this).css("background-position", 
        "center " + ((window.pageYOffset - $(this).offset().top) /
                     $(this).css("speed")) + "px");
});

ここで、速度は、スクロール中のアイテムの移動速度を制御する特定のアイテムに割り当てられた属性です。だから私は次のようなものを持っているでしょう：

#item { speed: 4; }

と

<div name="item" class="page"></div>

私はこれがでは不可能かもしれないことを理解していますCSS。HTML5はカスタム属性をサポートしていますが、要素に関する他の情報とともに、これらのことを頭のどこかで宣言したいと思います。
これを行う方法に関する推奨事項はありますか？

ありがとう！

4

2 に答える 2

2

これを CSS で行うことはできません。ただし、HTML5 カスタム属性を使用できます。ヘッダーですべてを宣言する場合は、質問で述べたように、jQuery 独自のメソッドを使用してデータを要素にバインドできます。

$(document).ready( function(){
    $.data(selector,'speed',5);
    alert($.data(selector,'speed')); //this will alert 5 now
});

ドキュメントはこちら: http://api.jquery.com/jQuery.data/

そして、これも機能するはずです: http://api.jquery.com/data/ - ここではコードが少し異なります:

$(document).ready( function(){
    $(selector).data('speed',5);
    alert($(selector).data('speed')); //this will alert 5 now
});

それが役立つことを願っています。

于 2012-04-06T08:05:25.623 に答える
1

カスタムdata-属性を持つ HTML5:

<div name="item" class="page" data-speed="4"></div>

data()ループでjQuery のメソッドを使用する:

parseInt($(this).data('speed'), 10);
于 2012-04-06T08:04:40.437 に答える