只需一個簡單的 CSS 和 jQuery 函數即可輕松刪除類時的轉換。我也嘗試過使用 Jquery，但似乎沒有任何效果。經過至少十幾次嘗試，有什么想法嗎？jQuery$(document).ready(function(){$(document).on('click', '.review-block', function(){ $(this).find(".review-body").toggleClass('small'); }); });CSS.review-body{ padding-right: 8px; padding-left: 8px; padding-top: 5px; font-family: sans-serif; font-size: 15px; margin-bottom: 10px; overflow: hidden; transition: all 1s ease;}.small{ max-height: 125px;}超文本標記語言<div class="review-body small"> //TEXT HERE</div>
2 回答
墨色風雨
TA貢獻1853條經驗 獲得超6個贊
之所以沒有觀察到轉變，是因為.review-body沒有顯式的max-height集合，這意味著它使用 的初始值auto。您無法在非像素值（例如auto，100%...）與設置的像素值之間轉換。
解決方案是提供.review-body一個更大的必要max-height值（以像素為單位），以便 CSS 過渡仍然有效，而無需剪切其中的內容。
三國紛爭
TA貢獻1804條經驗 獲得超7個贊
我認為您可能需要將該transition屬性添加到兩個類中。從 MDN 查看此 Codepen：https://codepen.io/pen/?&editable =true
- 2 回答
- 0 關注
- 141 瀏覽
添加回答
舉報
0/150
提交
取消