使用display和fadin()，fadeout发现的问题（待解决）

最近练习弹框效果使用到display，fadeIn()和fadeOut()
发现几个奇怪的问题

我实现的效果是，点击表格行遮罩层瞬间出现，遮罩上的子元素（也就是弹框）有一个透明度变化的过渡效果，以下我发现两个奇怪的地方

①display:block使遮罩显示时，弹框第一次的fadeIn()和fadeOut()是没有透明过渡效果的，之后再点击才会有
②在display下必须fadeIn()和fadeOut()都使用，否则这两个动画无效。(我在display:block后使用fadeIn(),关闭弹窗display:none;后使用一遍fadeOut()）

			$("#tableBody tr").click(function(){
				$("#dialog1").removeClass('hide-dialog')
				$(".detail-mess1").fadeIn('fast')
			})
			$("#t-body tr .watchBtn").click(function(){
				$("#dialog2").removeClass("hide-dialog")
				$(".detail-mess2").fadeIn('fast')
				getLineChart()
			})
			$("#close1").click(function(){
				$("#dialog1").addClass("hide-dialog")
				$(".detail-mess1").fadeOut('fast')//不加fadeOut，之前的fadeIn()动画会莫名失效
			})
			$("#close2").click(function(){
				$("#dialog2").addClass("hide-dialog")
				$(".detail-mess2").fadeOut('fast')
			})