0

この質問は、ここにある他のいくつかの質問と非常によく似ていますが、ひねりがあります。div の数は、0 から 12 までの間で指定できます。名前付き DIV は、回転する各オブジェクトで同じです。以下のコード:

PHP:

if($job->getPictureGalleries() != null){
$gallerys = $job->getPictureGalleries();
foreach($gallerys as $gallery){
    $gallery = Doctrine_Core::getTable('Gallery')->find($gallery);
    echo "<div class=\"galleries\">";
    include_partial('gallery/record', array('gallery' => $gallery));
    echo "</div>";
}
if(count($gallerys) > 1){
    $buttons = <<<EOD
<table style="box-shadow: 0.2em 0.2em 0.3em grey; width: 60%; margin-left: 20%; margin-top: 15px; background-color: whitesmoke; border: 1px solid grey; border-radius: 15px; height: 20px">
<tr style="width: 100%; ">
 <td style="width: 33%; text-align: right">
    <a href="#" id="previous_link"><img src="/web/images/previous.png" height="35" width="35" /></a>
 </td>
 <td style="
     width: 33%;
     color: #444444; 
     font-weight: bold;
     text-align: center;
     text-shadow: 0.1em 0.1em 0.3em grey;
 ">
    More Galleries
 </td>
 <td style="width: 33%">
    <a href="#" id="show_next_gallery" ><img src="/web/images/next_1.png" height="35" width="35" /></a></div>
 </td>
 </tr>
 </table>
 EOD;
    echo $buttons;
}
};

jQuery:

$(document).ready(function() {
if($('.galleries').size() > 1){
   $('.galleries').hide();
   $('.galleries').first().show();

   $("#show_next_gallery").click(function() {
       $('.galleries').first().hide();
       $('.galleries').nextAll().show();
        return false;
      });

   $("#previous_link").click(function() {
       $('.galleries').hide();
       $('.galleries').prevAll().show();
        return false;
      });
}

});

上記のコードは、オブジェクトが 2 つしか取得されない場合はうまく機能しますが、それ以上の場合は、次のボタンをクリックするとすべてが機能しなくなり、複数の div が表示されます。

4

3 に答える 3

1

存在する唯一のdivを提供するため、2つのdivのみで完全に機能nextAll()します。複数の divnextAll()がある場合、最初の div を除くすべての div が表示されます。

私が考えることができる可能な解決策は、次のような各 div にある種の数値識別子を割り当てることです。

<div class="galleries" num="1">...</div>
<div class="galleries" num="2">...</div>
<div class="galleries" num="3">...</div>

あなたのjquery:

//hide all galleries except first
$('.galleries:not([num=1])').hide();
$("#show_next_gallery").click(function() {
    var curr = $('.galleries:visible').attr('num');
    var next = curr + 1;
    $('.galleries[num='+curr+']').hide();
    $('.galleries[num='+next+']').show();
    return false;
});

$("#previous_link").click(function() {
    var curr = $('.galleries:visible').attr('num');
    var prev = curr - 1;
    $('.galleries[num='+curr+']').hide();
    $('.galleries[num='+prev+']').show();
    return false;
});

テストしていませんが、アイデアはわかります。

于 2013-04-22T13:49:22.007 に答える