0

被这个小问题困住了,设法让我的 Wordpress 循环使用正确的东西.. 一切正常。我遇到的问题是当我尝试在悬停时定位单个项目。我已经让我的 jquery 脚本正常工作,但它针对所有这些。我知道我必须更改循环,但不确定我打算做什么。无论如何,这是我的代码。如果你们能帮忙就太好了..谢谢

WordPress 循环

 <?php $i = 0 ?>
        <?php query_posts('showposts=3'); ?>
        <?php if(have_posts()) : while (have_posts()) : the_post(); ?>
        <?php if( $i == 3 ) : ?>
        <div class="row">
            <?php endif; ?>
                <div class="col-lg-4 col-md-4">
                    <a href="<?php the_permalink(); ?>">
                        <div class="miniwork">
                            <?php 
                                if ( has_post_thumbnail() ) {
                                the_post_thumbnail();
                                } 
                            ?>
                            <figcaption><?php the_title(); ?></figcaption>
                        </div>
                    </a>
                </div>

                <?php $i++ ?>

                <?php endwhile; ?>
            <?php endif; ?>

        </div> 

jQuery悬停

 jQuery(".miniwork" ).hover(
  function() {
    jQuery('.miniwork figcaption').addClass('animated tada');
    jQuery('.miniwork figcaption').css('visibility', 'visible');
    var filterVal = 'blur(8px)';
    jQuery('.miniwork img')
      .css('filter',filterVal)
      .css('webkitFilter',filterVal)
      .css('mozFilter',filterVal)
      .css('oFilter',filterVal)
      .css('msFilter',filterVal);
    jQuery('.miniwork figcaption').css('opacity', '0.95')
  }, function() {
    jQuery('.miniwork figcaption').removeClass('animated tada');
    jQuery('.miniwork figcaption').css('visibility', 'hidden');
    jQuery('.miniwork figcaption').css('visibility', 'hidden');
    var filterVal = 'blur(0px)';
    jQuery('.miniwork img')
      .css('filter',filterVal)
      .css('webkitFilter',filterVal)
      .css('mozFilter',filterVal)
      .css('oFilter',filterVal)
      .css('msFilter',filterVal);
      jQuery('.miniwork figcaption').css('opacity', '0')
  }
);
4

1 回答 1

1

您的目标"miniwork"是分配给每个 div 的类 .. 您也可以将 #id 分配给每个 div,例如-

<div class="miniwork" id="<?php echo get_the_ID(); ?>">
    <?php 
        if ( has_post_thumbnail() ) {
        the_post_thumbnail();
        } 
    ?>
    <figcaption><?php the_title(); ?></figcaption>
</div>

现在在 jQuery taget ' miniwork#id-of-the-post'

于 2013-10-06T14:31:24.547 回答