Question

我想在没有悬停的情况下在圆圈中显示一个徽标（例如.item-logo），因为悬停在容器中会显示日期。

HTML

<div id="main-content" class="container animated"> <div id="content">
 <article class="post-65 post type-post status-publish format-standard hentry category-thoughts tag-example tag-standard tag-tag item-list">
 <div class="post-format-icon">
 <a href="<?php echo get_permalink(); ?>" class="item-date"><span><?php the_time('j') ?></span><small><?php the_time('M') ?></small></a>
</div>

你可以在这里看看JS Fiddle，日期不被视为它的PHP。话虽如此，徽标应该改变为悬停的日期。 http://jsfiddle.net/xJv5x/

谢谢！

Answer 1

使用CSS很容易实现。基本上，你将图像隐藏在锚点内，并在悬停时显示其他内容，例如

<a href="#foo">
    <div>02-01</div>
    <img src="http://placekitten.com/100/100" />
</a>

a div, a:hover img {display:none;}
a:hover div {display:block;}

这里是小提琴：http://jsfiddle.net/gwDWS/

当锚悬停在锚上时，将锚内的图像切换为文本

1 个答案: