答案 0 :(得分:1)
我不知道任何可以自动执行此操作的插件,但如果您不介意编辑主题,则不应该自己做难。我做了一个例子here
在帖子循环中,您可以像这样打印每个帖子:
<div class="block">
<?php the_post_thumbnail(); ?>
<div class="overlay">
<div class="title"><?php the_title(); ?></div>
<div class="excerpt"><?php the_excerpt(); ?></div>
<div class="link">
<a href="<?php the_permalink(); ?>">Link to full post</a>
</div>
</div>
</div>
然后使用CSS链接将内容放在图像上,隐藏它,然后将鼠标悬停在框上时显示:
.block {
width: 300px;
margin: 0 20px 20px 0;
position: relative;
}
.block .overlay {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(255,255,255,0.5);
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
.block:hover .overlay {
opacity: 1;
filter: alpha(opacity=100);
}