Question

将鼠标悬停在img上一次后，效果会消失。我希望我的效果在无限次第一次悬停后继续。

<?php query_posts('showposts=6&cat=-4'); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); if ( $post->ID == $do_not_duplicate ) continue; update_post_caches($posts); ?>

<li class="show1">

<?php $thumb = get_post_meta($post->ID, 'thumb', true); ?>

<a href="#" title="Permanent Link to <?php the_title_attribute(); ?>" class="show"><?php echo$thumb; ?></a>

<div class="hide">

<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>

<?php the_excerpt(); ?>

<a class="view_project" href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">View Project »</a>
</div>
</li>

和Javascript

<script type="text/javascript">
$(function() {
    $('li.show1').children('.hide').hide();

    $('li.show1').hover(function() {
    $(this).children('a.show').fadeOut('slow')
        .end().children('.hide').fadeIn('slow');
    }, function() {
    $(this).children('a.show').fadeIn('slow')
        .end().children('.hide').fadeOut('slow');
});
});
</script>

Answer 1

问题在于：CSS代码中的悬停效果。通过更改CSS以获得更简单的声明，我得到了working fiddle。

另外，我认为你根本不需要隐藏/显示.show元素;删除它并没有以任何方式改变行为。

所以，这是做什么的：

删除与.show / .hide
删除js fadeIn / fadeOut for .show？
使用display：none for .hide（请参阅我的小提琴）以保持最初隐藏

你将有一个工作淡出！ ;）

Answer 2

您的代码运行正常。我正在使用FF 7.0.1。也许您正在使用旧浏览器。

jQuery效果不会重复

2 个答案: