我目前使用以下代码循环获取所有这些帖子,并显示它们:

     <div class="row" style="margin-bottom:50px;">
                        <!-- First, the loop checks whether any posts were discovered with the have_posts() function. -->
                        <?php if (have_posts()) : ?>
                        <!-- First, the loop checks whether any posts were discovered with the have_posts() function. -->
                        <!-- If there were any posts, a PHP while loop is started. A while loop will continue to execute as long as the condition in the parenthesis is logically true. So, as long as the function have_posts() returns a true value, the while loop will keep looping (repeating). -->
                        <?php while (have_posts()) : the_post(); ?>
                        <a href="<?php echo get_permalink(); ?>">
                         <?php echo "<div class='col-md-6 col-sm-6 col-xs-12' style='margin-bottom:30px;'>"; ?>
                         <div class="row mobilemargin">
                              <div class="categorytiletext">
                                    <div class="col-md-6 col-sm-12 col-xs-12 nopr"><?php echo get_the_post_thumbnail( $page->ID, 'categoryimage', array('class' => 'newimgheight hovereffect')); ?> </div>
                                    <div class="col-md-6 col-sm-12 col-xs-12 mobilewhite">
                                          <div class="testdiv">
                                               <h5 class="captext"><?php the_title(); ?></h5>
                                               <?php $trimexcerpt = get_the_excerpt();

                                               $shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 10, $more = '… ' ); 

                                               echo '<a href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>'; 

                                               ?>
                                         </div>
                                   </div>
                             </div>
                       </div>
                       <?php echo "</div>"; ?>

                 </a>
                 <!-- If there is no posts, display an error message -->
           <?php endwhile; else: ?>
           <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
     <?php endif; ?>
     <!-- If there is no posts, display an error message -->
</div>

现在,我有了一个类,该类在我的图像上名为hovereffect,这使不透明度发生了变化。 如您所见,图像在6列中,文本在6列中。 有没有一种方法,当文本悬停在上方时,可以更改图像的不透明度?

===============>>#1 票数:1

您可以使用jQuery hover()方法 ,如下所示:

$('p').hover(function() {
  $('.hovereffect').css('opacity', '0.5');
});

除了直接更改CSS外,您还可以切换另一个类或您喜欢的类。

编辑:我刚刚读到您使用hovereffect类更改不透明度。 在这种情况下,您不应在php中添加该类,而应使用以下jQuery:

$('p').hover(function() {
  $('.anotherClassOnYourImage').toggleClass('hovereffect');
});

不应将“ p”用作选择器,而应向其添加一个类。

  ask by translate from so

未解决问题?本站智能推荐:

1回复

将鼠标悬停在带有冲突代码的WordPress主题上

因此,我当前正在使用以下脚本(效果3): http : //tympanus.net/codrops/2013/06/18/caption-hover-effects/ 我试图使这些框显示在我的博客内容列表中,该列表当前使用内容功能。 为此,我已经包含了对演示文件的CSS和JS的调用;
1回复

使用wordpress按时间间隔和将鼠标悬停在链接上时更改图像

我想问一下如何使图像在时间间隔上变化(比如说5秒钟后),而这些相同的图像根据链接的悬停而变化(类似于www.gamespot.com这样的网站)。 我有这些链接: 好的,到目前为止,我已经设法创建了这个:所以jquery看起来像这样: 我将.js文件添加到“ wp-includ
1回复

Wordpress ACF:“图像”字段,将鼠标悬停在上方即可更改图像

代替这个: 我用它(及其工作): 原始问题: 我有一个灵活的内容字段,其中包含名称,指向个人页面的链接和2个图像字段(均为返回对象ID):原始图像和“鼠标悬停”图像。 我想在页面上显示这些字段,所以我添加了以下代码(在while语句之间,但这弄乱了代码: 效果
6回复

仅将鼠标悬停在图像CSS上

我目前有以下代码: 我想做的是,当您将鼠标悬停在周围的div(类别文本)上时,仅​​图像会添加“ hovereffect”类,从而改变了不透明度。 使用此脚本: 这基本上是将类添加到整个div(通过编码来完成),但是我只需要图像具有该类即可。 有任何想法吗? 编
1回复

如何仅在具有悬停摘录的图像帖子上显示wordpress帖子摘录

我创建了一个wordpress帖子的gridview,我试图显示每个thumbnail(post)在鼠标悬停时的摘录,但是如果任何thumbnail(post)没有任何摘录内容,则不应显示该摘录。
1回复

将鼠标悬停在另一个div上时,将图像旋转并向右移动图像

我想将鼠标悬停在图像(音乐专辑)上,然后推出记录,因此我希望它向右移动并旋转一点。 它已经可以向右移动,但我无法使其随其旋转。 #cover1是专辑,而#coverrecord1是需要推出的记录,我喜欢尽可能简化,因为我不是编码专家。 非常感谢。
1回复

用户无法在Wordpress中看到索引上的图像[关闭]

朋友,在索引页面上有每个标题的图像,但未显示。 这是网站: www.manisaihtiyac.com 我认为此代码有问题:
4回复

使一个(图像)向右移动并旋转45度,同时将鼠标悬停在另一个(图像)上

我想将鼠标悬停在图像(音乐专辑)上,然后推出记录,因此我希望它向右移动并旋转一点,当它悬停时,我希望它也可以通过动画恢复正常。 它已经可以向右移动,但我无法使其随其旋转。 我喜欢尽可能简化,因为我不是编码专家。 我将javascript用于运动部分,如下所示,
1回复

WordPress鼠标悬停在带有背景色的文本上吗?

我是wordpress的新手,并使用4.2.2版本。 我需要在图像上带有文字的背景颜色上显示鼠标。 给定的文本和图像是从管理面板动态生成的。 我提供了以下图像供您参考,第一张图像现在是我的网站,第二张图像我需要这样做。 提前致谢!
2回复

如何设置家用类背景图像以从预定目录加载随机图像

我试图让我的wordpress网站在每次刷新页面时在首页上加载不同的背景图片。 该网站是http://americasfinestlighting.com 我想向我的functions.php文件中添加一个函数或向我的home.php文件中添加一个脚本。 我目前正在使用以下CS