我在我的网站上使用Wordpress。我想要实现的是,如果我将鼠标悬停在特定的帖子上,它应该显示该帖子的标题。但它现在做的是,如果我将鼠标悬停在一个帖子上,它会显示所有帖子的标题。
代码:
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post">
<div>
<div class="post-header"><a href="<?php the_permalink() ?>">
<?php if ( p75HasThumbnail($post->ID) ) { ?>
<img src="<?php echo p75GetThumbnail($post->ID, 200, 108); ?>" alt="<?php the_title(); ?>" width="200" height="108" />
<?php } ?>
</a></div>
<div class="post-content" style="display:none;">
<h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2>
</div>
<div class="post-footer">
<small>
In: <?php the_category(' | ') ?>
</small>
</div>
</div>
</div>
<!-- -->
<?php endwhile; ?>
<?php next_posts_link('<div class="post archiveTitle "><div>← Older</div></div>') ?>
<?php previous_posts_link('<div class="post archiveTitle "><div>Newer →</div></div>') ?>
<?php else : ?>
<div class="post">
<div>
<h1>Not Found</h1>
<p>Sorry, but you are looking for something that isn't here.</p>
</div>
</div>
<?php endif; ?>
JS:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('.post-header').hover(function(){
$('.post-content').show();
}, function(){
$('.post-content').hide();
});
});
</script>
答案 0 :(得分:3)
我不确定,如果是这样,你想要实现的目标:
$('.post-header').hover(function(){
$('.post-content', $(this).parent()).show();
}, function(){
$('.post-content').hide();
});
现在只显示当前悬停的帖子的后期内容。