0

さて、私は5つの画像を持っています。これらの画像を選択すると、その下の画像に大量の情報が表示されます。画像とテキストはカスタムの連絡先タイプで保存されています。これで、カスタムコンテンツタイプの最初の投稿である最後の画像で動作するようになりました。私は自分のjQueryを書くのは初めてなので、ループごとに何らかのものが必要かどうかわかりませんか?

ここでは、画像クラスにIDが与えられているため、全員が異なります

<a href="#" class="tutorlink-<?php the_id(); ?>"><img src="<?php echo $TutorImageURL[0]; ?>" alt="<?php echo get_post_meta($att, '_wp_attachment_image_alt', true); ?>" /></a>              
<?php endwhile; ?>
<div class="tutor-block">
<img src="<?php bloginfo('template_directory'); ?>/images/click.png" alt="tutors"/>
</div>

<div class="tutor-description">
<?php // The Loop
 while ( $tutors->have_posts() ) : $tutors->the_post(); ?>

ここで、含まれているdivクラスにも独自のIDが与えられます

<div class="tutor-description-inner-<?php the_id(); ?>">
  <?php the_content(); ?>
</div>

このスクリプトは、最初にテキストを非表示にします。

<script>
var id = <?php echo $theID; ?>;
$('.tutor-description-inner-'+id+'').hide();
</script>

これが私がこれまでに書いたスクリプトで、最後の画像のテキストを切り替えます。

<script>                  
 $(document).ready(function() {
   $('.tutorlink-'+id+'').click(function() {
     $('.tutor-description-inner-'+id+'').toggle('slow');   
  return false;
    });
});
</script>

アイデアをお願いします?

4

1 に答える 1