[英]ng-hide not working properly
我正在嘗試在angularjs中使用ng-hide和ng-show編碼解決方案。 在單擊ng-hide時,它會在隱藏以顯示視圖面板之前延遲。 請出什么問題。 這是我做的一個矮人。
http://plnkr.co/edit/IiSwQ1cijiypdwIXV6K7?p=preview
這是代碼視圖:
<div ng-app="myApp">
<h1>Ng-show & ng-hide</h1>
<p class="description">Click on the "show"-link to see the content.</p>
<a href="" ng-click="showme=true">Show</a>
<button ng-click="showme=false">Hide</button>
<div class="wrapper">
<p ng-hide="showme">It will appear here!</p>
<h2 ng-show="showme">This is mah content, yo!</h2>
</div>
</div>
這是因為您為此添加了動畫效果,在隱藏h2
標簽的同時延遲了2s的transition
。 減少過渡將提高其速度。 為了擺脫隱藏元素時的延遲,您應該刪除css
CSS的 transition
屬性
h2 {
color: #2980b9;
margin-bottom: 9px;
margin-top: 0;
font-size: 20px;
background-color: white;
/*width: 100px;*/
text-align: center;
padding: 16px;
z-index: 15;
border-radius: 4px;
/*transition: all 0.1s ease-out;*/ //<-- reduced it to 0.1 sec will
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.