Question

我在wordpress中为自定义帖子类型分配了多个精选图片。我试图得到它，以便在悬停时特色图像1（投资组合 - 标题 - 图像）更改为特色图像2（投资组合 - 悬停图像）。这是我的wordpress自定义帖子页面中的PHP，其中特色图像来自。我尝试了各种jquery方法，但是我的知识还不足以提出解决方案。

<div class="portfolio-item">

<a href="<?php the_permalink(); ?>">

<?php if( class_exists( 'kdMultipleFeaturedImages' ) ) { kd_mfi_the_featured_image( 'portfolio-title-image', 'portfolio' );}?></a>

<?php if( class_exists( 'kdMultipleFeaturedImages' ) ) { kd_mfi_the_featured_image( 'portfolio-hover-image', 'portfolio' );}?></a>

</div>

Answer 1

CSS方法。

标记：

<div class="portfolio-item">
    <a href="<?php the_permalink(); ?>" class="cont">

      <div class="unhover_img">
        <?php if( class_exists( 'kdMultipleFeaturedImages' ) ) { kd_mfi_the_featured_image( 'portfolio-title-image', 'portfolio' );}?>
      </div>

      <div class="hover_img">
        <?php if( class_exists( 'kdMultipleFeaturedImages' ) ) { kd_mfi_the_featured_image( 'portfolio-hover-image', 'portfolio' );}?>
      </div>

    </a>
    </div>

CSS：

.hover_img {
  display: none
}
.cont:hover .unhover_img{
  display: none;
}
.cont:hover .hover_img {
  display: block;
}

在悬停时更改Wordpress特色图片

1 个答案: