У меня есть articles
(записи в блоге), чтобы пользователь мог нависнуть над ними, чтобы открыть заголовки. Тем не менее, для статей с классом post-0
я бы хотел, чтобы заголовки отображались просто без необходимости наводиться на них.Сообщение в блоге: не позволяет пользователю наводиться на сообщения с конкретными идентификаторами
После изучения селекторов jQuery, похоже, что нужно использовать селектор .not, но я совершенно не понимаю, как его реализовать в коде. Ниже приведен сценарий, который я использую. Может ли кто-нибудь показать мне способ добиться этого?
Так что я хотел бы реализовать что-то вроде $("article").not(".post-0");
Вот скрипку: http://jsfiddle.net/dz30ov2a/
В принципе, я не хочу, чтобы «в ближайшее время» окно, чтобы быть «hoverable».
JavaScript
$(document).on("mouseenter mouseleave", "article", function(e) {
// mouseenter variable returns true if mouseenter event is occurring
// and it returns false if event is anything but mouseenter.
var mouseenter = e.type === "mouseenter",
$this = $(this),
img = $this.children('img'),
postInfo = $this.children('.post-info');
// Both of these use ternary if statements that are equal to:
// if (mouseenter) { var imgFade = 0.4; } else { var imgFade = 1; }
// if (mouseenter) { var postInfoFade = 'fadeIn'; } else { var postInfoFade = 'fadeOut'; }
var imgFade = mouseenter ? 0.4 : 1,
postInfoFade = mouseenter ? 'fadeIn' : 'fadeOut';
img.stop().fadeTo(500, imgFade);
postInfo.stop()[ postInfoFade ](500);
});
HTML
<div id="article-list">
<article id="post-1" class="post-1 post type-post status-publish format-standard has-post-thumbnail hentry category-uncategorized">
<div class="post-info">
<h1 class="entry-title"><a href="post-1/" rel="bookmark">Post 1</a></h1>
<span class="posted-on">
<a href="post-1/" rel="bookmark">
<time class="entry-date published" datetime="2014-08-14T13:02:27+00:00">August 14, 2014</time>
<time class="updated" datetime="2014-09-05T02:20:16+00:00">September 5, 2014</time>
</a>
</span>
</div>
<img width="312" height="200" src="http://i.imgur.com/DYsiQ1a.jpg" class="attachment-post-thumbnail wp-post-image" alt="post-1" style="opacity: 0.4;">
</article><!-- #post-## -->
<article id="post-0" class="post-0 post type-post status-publish format-standard hentry">
<div class="post-info">
<h1 class="entry-title"><a href="" rel="bookmark">Coming Soon</a></h1>
<span class="posted-on">
<a href="" rel="bookmark">
<time class="entry-date published" datetime="2014-08-14T13:02:27+00:00">August 14, 2014</time>
<time class="updated" datetime="2014-09-05T02:20:16+00:00">September 5, 2014</time>
</a>
</span>
</div>
<img src="http://i.imgur.com/8rca7SA.gif" alt="Coming soon" style="opacity: 1;">
</article><!-- #post-## -->
</div>
разместим ваш HTML, а также. И скрипка. – j08691
@ j08691 Готово и сделано. – J82
Так вот так http://jsfiddle.net/j08691/6g1qd4Lb/? – j08691