/ / Proprietà CSS personalizzate o attributi HTML? - jquery, html, css

Proprietà CSS personalizzate o attributi HTML? - jquery, html, css

Sto sperimentando lo scorrimento della parallasse e voglio fare qualcosa del tipo:

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

Dove velocità è un attributo assegnato all'elemento specifico che controlla la velocità di movimento di un elemento durante lo scorrimento. Quindi avrei qualcosa del tipo:

#item { speed: 4; }

e

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

Capisco che potrebbe non essere possibile con CSS. HTML5 supporta attributi personalizzati, ma preferirei dichiarare queste cose da qualche parte nella testa con altre informazioni sull'elemento.
Qualche consiglio su come farlo?

Grazie!

risposte:

2 per risposta № 1

Non puoi farlo con CSS. Ma puoi usare gli attributi personalizzati HTML5 e se vuoi dichiarare tutto nell'intestazione, come hai detto nella tua domanda, puoi usare il metodo di jQuery per associare i dati agli elementi:

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

I documenti sono qui: http://api.jquery.com/jQuery.data/

E questo dovrebbe anche funzionare: http://api.jquery.com/data/ - il codice apparirebbe un po 'diverso qui:

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

Spero che aiuti.


1 per risposta № 2

HTML5 con personalizzato data- attributo:

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

Utilizzando jQuery data() metodo nel tuo ciclo:

parseInt($(this).data("speed"), 10);