引入显示消息的延迟。转换延迟属性不起作用

时间:2014-04-18 19:10:12

标签: html css angularjs

我有以下div标签,其中包含一个向上箭头。如果它悬停在它上面会显示一条消息。 我希望在提示该消息时有一秒钟的延迟。我使用了transition-delay属性,但它不起作用。 (注意 - 为了演示目的,我特意将css保留为内联。) 也可以使用Angularjs完成吗? 任何帮助将不胜感激。

<div class="col-xs-1" style="margin-left:-40px;">
     <div class="arrow-up" ng-mouseover="message_up = true" ng-mouseleave="message_up= false" ng-click="saveVote(review[0].review_id,1);"></div>
     <div class="message" ng-show="message_up" style="width:180px;position:absolute;margin-left:10px; margin-top:15px; background-color:#333;text-align:center;z-index:1001;color:white;transition-delay: 3s;">This review is helpful and clear.</div>
</div>

1 个答案:

答案 0 :(得分:0)

您希望转换延迟发生的属性是什么?因为你说过你只是在一段时间后出现这个消息...我在这里创造了一个小提琴http://jsfiddle.net/ZMc2S/

所有我为消息div添加了不透明度值并给出了

transition-property: opacity

希望这会有所帮助