如果他的身高超过300px,我试图找到一个元素的高度并为其添加一个类。 我知道这个问题有一些答案,但我不知道自己做错了什么..
如果text
有height > 300px
这是我迄今为止所做的:
var myApp = angular.module('myApp', []);
myApp.directive('overflow', function () {
return {
restrict: 'A',
link: function (scope, elem, attrs) {
var height = elem.height();
if(height>100) {
elem.addClass('overflow');
}
else {
elem.removeClass('overflow');
}
}
};
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
<div overflow class="text">
<p>
long text long text long textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong textlong text
</p>
</div>
</div>
答案 0 :(得分:0)
如果您不想使用angular或jquery并且只想使用CSS,那么这个解决方案应该可行 -
.text p {
max-width:300px;
max-height:100px;
overflow:auto;
}
请参阅此fiddle
答案 1 :(得分:0)
答案 2 :(得分:0)
添加max-height:300px;和溢出-y:滚动;属性为CSS并在if条件下使用下面的代码。
elem.addClass('text');