0

大変申し訳ありませんが、数時間試した後、専門家に聞いてみてください:)

Tumblrテーマに次のコードがあります。

   {block:Photo}
   <li class="post photo"> 
   // Retrieving photo url here using {PhotoURL-500}.
   {/block:Photo}

これにより、すべての写真投稿が取得され、ページに表示されます。

次に、画像の向きに応じて、liにクラスを設定します。私はこれを使用して取得しました：

<script type="text/javascript">

var width = {PhotoWidth-500}; // this is a Tumblr variable that gets the width
var height = {PhotoHeight-500}; // this is a Tumblr variable that gets the height

if (width > height) {
// Here I get stuck, I want to append class="horizontal" to the li above.
}
else {
// append class="vertical"
}
</script>

ただし、{block：Photo}内でjavascriptを呼び出す必要があります。そうしないと、各写真の個々の高さと幅を判別できません。そしてリマインダーとして; PHPでこれを実行してエコーしたいのですが、Tumblrでは許可されていません。そして私はJSの初心者です...

助けていただければ幸いです！前もって感謝します！

4

1 に答える 1

1

最新のブラウザでは、セレクタに一致する要素querySelectorAllを取得するために使用できます。NodeList

var list = querySelectorAll(".post.photo");

...そして、それらをループして、それらのclassNameプロパティに追加します。例えば：

var list = querySelectorAll(".post.photo"),
    index,
    node;

for (index = 0; index < list.length; ++index) {
    node = list[index];
    if (some_condition) {
        node.className += " theNewClassToAdd";
    }
}

古いブラウザをサポートする必要がある場合getElementsByClassNameは、長い間使用されてきました（ただし、単一のクラスによるクエリしかサポートされていないため、両方のクラスが存在することを確認するために後処理する必要があります）。

または、最も幅広いサポートを得るには、 jQuery、YUI、Closure、またはその他のいくつかの適切なライブラリを使用して、他の人の作業を活用します。

于 2012-10-27T22:28:42.010 に答える