5

私は worpdress サイトを構築しており、ショートコードを使用して構築されたページに複数のギャラリーがあります。現時点では、すべての画像に rel 属性 'prettyPhoto[1]' が与えられていますが、各ギャラリーを個別にする必要があります。このページには全部で 56 枚の画像があるので、ギャラリー 1 の最初の画像がライトボックスで開くと 1/56 と表示され、56 枚の画像すべてをクリックすることができます。 /16 など。 raw.js ファイルで次のスクリプト行を編集するように言われました。

$(".gallery-icon a").attr('rel', 'prettyPhoto[1]');

しかし、それをどうするかわかりませんか?どんな助けでも大歓迎です。問題のページへのリンクは次のとおりです。

http://www.tetra-shed.co.uk/news/

4

3 に答える 3

8

prettyPhoto は、角かっこの内容に基づいてギャラリーをグループ化します。すべてギャラリー 1 に割り当てられているため、同じギャラリーで 56 枚すべての画像を取得しています。

本当に必要なのは、ギャラリー 1 の最初の 16 個です。

$(".gallery-icon a").attr('rel', 'prettyPhoto[1]');

ギャラリー 2 の次の 16 個。

$(".gallery-icon a").attr('rel', 'prettyPhoto[2]');

rel問題は、属性が JS を介して割り当てられている場合、それをどのように行うかです。親の親のdiv IDに基づいてそれを行うことを検討します。各 gallery-icon 要素には、親 gallery-item があります。これらはそれぞれ、特定の ID を持つギャラリー クラスの一部です。例えば

<div id='gallery-3' class='gallery galleryid-555 gallery-columns-4 gallery-size-thumbnail'>
    <dl class='gallery-item'>
        <dt class='gallery-icon'>

そのため、一意のギャラリー ID をプリティ フォトの rel 値として割り当てる必要があります。すなわち;

$(".gallery-icon a").attr('rel', 'prettyPhoto[gallery-3]');

次のように、すべてのギャラリー アイコンclosest()を検索し、親ギャラリー ID を検索するために使用します。

Jqueryを使用して親divのIDを見つける

私はそれをテストしていませんが、このようなものは正しい方向に進むはずです。

            $('#content').find('.gallery-icon a').each(function() {

                var gallid = $(this).closest("div").attr("id");

                $(this).attr('rel', 'prettyPhoto['+ gallid +']');

            });     
于 2012-12-13T20:44:27.433 に答える
0

もっと簡単な解決策があったかもしれません。すべてのギャラリーdiveach機能させてから、そのprettyPhoto中の画像を初期化しています。

$(document).ready(function(){
    $.each($(".gallery"), function(i, val) {
        var queryString = ".gallery:nth(" + i + ") a[rel^='prettyPhoto']";
        $(queryString).prettyPhoto({animation_speed:'normal',theme:'light_square', social_tools: false});
    });
});
于 2014-01-04T17:26:01.687 に答える