.on("mouseout", function) não funciona

[Julio Cavallari 3]

Estou tentando fazer um efeito em uma imagem, para aparecer o título dela somente quando o mouse estiver em cima, e estou utilizando essa função abaixo, mas somente o" mouseoverr" funciona, quando o mouse sai do elemento, ele não esconde  como mouseout deveria fazer. Mas meu console não acusa nenhum erro.

 

(function($){
	$(document).ready(function(e){
		$(".title-post").hide();
		$(".entry-thumb").on("mouseover", function(){
			$(".title-post").show();
		});
		$(".entry-thumb").on("mouseout", function(){
			$("title-post").hide();
		});
	});
})(jQuery);

[William Bruno 1501]

faltou o . (ponto)

 

$(".title-post").hide();

 

[Julio Cavallari 3]

Me deparei com outro problema, quando eu coloco o mouse em cima, ele me mostra o nome de todos os posts, e é pra aparecer somente do post que o mouse está em cima

[William Bruno 1501]

Como é o teu html?

 

leia:

http://wbruno.com.br/jquery/navegando-no-dom-jquery/

[Julio Cavallari 3]

<article id="post-106" class="post-106 post type-post status-publish format-image has-post-thumbnail hentry category-newborn post_format-post-format-image">

			<div class="entry-thumb">
			<a href="http://brunooliveirafotoedesign.esy.es/newborn/newborn-samuel/" title="Newborn Samuel"><img width="830" height="553" src="http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-830x553.jpg" class="attachment-sydney-large-thumb size-sydney-large-thumb wp-post-image" alt="" srcset="http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-830x553.jpg 830w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-300x200.jpg 300w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-768x512.jpg 768w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-230x153.jpg 230w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-350x233.jpg 350w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n-480x320.jpg 480w, http://brunooliveirafotoedesign.esy.es/wp-content/uploads/2017/04/17554051_1804160642931324_7776911605029775934_n.jpg 960w" sizes="(max-width: 830px) 100vw, 830px" /></a>	
		</div>
	<header class="entry-header">
		<h2 class="title-post entry-title"><a href="http://brunooliveirafotoedesign.esy.es/newborn/newborn-samuel/" rel="bookmark">Newborn Samuel</a></h2>
			</header><!-- .entry-header -->
	<div class="entry-post">
							
			</div><!-- .entry-post -->

	<footer class="entry-footer">
		<span class="edit-link"><a class="post-edit-link" href="http://brunooliveirafotoedesign.esy.es/wp-admin/post.php?post=106&#038;action=edit">Edit</a></span>	</footer><!-- .entry-footer -->
</article><!-- #post-## -->

o id do article é dado automaticamente pelo PHP do tema do WP

[William Bruno 1501]

(function($){
	$(document).ready(function(e){
		$(".title-post").hide();
		$(".entry-thumb").on("mouseover", function(){
			$(this).parents('.post').find('.title-post').show();
		});
		$(".entry-thumb").on("mouseout", function(){
			$(this).parents('.post').find('.title-post').hide();
		});
	});
})(jQuery);

 

você leu o link que postei?

 

ps: não dê UPs nos teus posts. 

[Julio Cavallari 3]

(function($){
	$(document).ready(function(e){
		$(".title-post").hide();
		$(".entry-thumb").on("mouseover", function(){
			$(this).parents('.post').find('.title-post').show();
          		$(this).addClass("hover");
		});
		$(".entry-thumb").on("mouseout", function(){
			$(this).parents('.post').find('.title-post').hide();
          		$(this).removeClass("hover");
		});
	});
})(jQuery);

Com essas 2 linhas adicionadas, o jquery vai adicionar e remover a classe hover no elemento?

[William Bruno 1501]

ai ele vai colocar a classe hover no .entry-thumb.

você queria ela onde?

[Julio Cavallari 3]

no .entry-thumb mesmo, pra dar um efeito de hover na imagem

[William Bruno 1501]

nesse caso era mais fácil usar o css :hover