Authored by ccbikai

CSS 文字截断

@@ -7,7 +7,6 @@ @@ -7,7 +7,6 @@
7 var $ = require('yoho-jquery'), 7 var $ = require('yoho-jquery'),
8 Swiper = require('yoho-swiper'), 8 Swiper = require('yoho-swiper'),
9 tip = require('../plugin/tip'), 9 tip = require('../plugin/tip'),
10 - lazyLoad = require('yoho-jquery-lazyload'),  
11 loading = require('../plugin/loading'), 10 loading = require('../plugin/loading'),
12 PullRefresh = require('../plugin/pull-refresh'); 11 PullRefresh = require('../plugin/pull-refresh');
13 12
@@ -41,13 +40,14 @@ if ($window.width() === 375 && isiOS) { @@ -41,13 +40,14 @@ if ($window.width() === 375 && isiOS) {
41 } 40 }
42 41
43 require('../common'); 42 require('../common');
  43 +require('yoho-jquery-lazyload');
44 44
45 $window.on('mousewheel', false); 45 $window.on('mousewheel', false);
46 46
47 // 限制标题字数 47 // 限制标题字数
48 -function txtLimit() {  
49 -  
50 -} 48 +// function txtLimit() {
  49 +//
  50 +// }
51 51
52 // 设置默认头像 52 // 设置默认头像
53 function setAvatar($userAvatar) { 53 function setAvatar($userAvatar) {
@@ -140,13 +140,13 @@ function setIndexAction() { @@ -140,13 +140,13 @@ function setIndexAction() {
140 }); 140 });
141 } 141 }
142 142
143 - if ($('.star-info').find('li').length > 0) {  
144 - $starArticle.each(function(key, item) {  
145 - txtLimit($(item), '.article-title', 'p');  
146 -  
147 - // articleImgAction($(item), key);  
148 - });  
149 - } 143 + // if ($('.star-info').find('li').length > 0) {
  144 + // $starArticle.each(function(key, item) {
  145 + // txtLimit($(item), '.article-title', 'p');
  146 + //
  147 + // // articleImgAction($(item), key);
  148 + // });
  149 + // }
150 150
151 $('.rank-avatar').each(function(key, item) { 151 $('.rank-avatar').each(function(key, item) {
152 setAvatar($(item)); 152 setAvatar($(item));
@@ -170,11 +170,6 @@ function initAction() { @@ -170,11 +170,6 @@ function initAction() {
170 170
171 $avatarClone = $('.avatar-clone'); 171 $avatarClone = $('.avatar-clone');
172 172
173 - // 限制标题字数  
174 - $('.cont-area').each(function() {  
175 - txtLimit($(this), '.title', '.cont-txt');  
176 - });  
177 -  
178 $('img.lazy').lazyload({ 173 $('img.lazy').lazyload({
179 effect: 'fadeIn' 174 effect: 'fadeIn'
180 }); 175 });
@@ -240,8 +240,14 @@ @@ -240,8 +240,14 @@
240 .article-title { 240 .article-title {
241 font-size: 28px; 241 font-size: 28px;
242 line-height: 38px; 242 line-height: 38px;
  243 + height: 76px;
243 color: #fff; 244 color: #fff;
244 - word-wrap: break-word; 245 + text-overflow: ellipsis;
  246 + overflow: hidden;
  247 + word-break: break-all;
  248 + display: flex;
  249 + -webkit-box-orient: vertical;
  250 + -webkit-line-clamp: 2;
245 } 251 }
246 252
247 .artice-cont { 253 .artice-cont {
@@ -256,6 +262,7 @@ @@ -256,6 +262,7 @@
256 } 262 }
257 263
258 .artice-imgs-area { 264 .artice-imgs-area {
  265 + position: relative;
259 display: table; 266 display: table;
260 margin: 10px 0; 267 margin: 10px 0;
261 width: 266px; 268 width: 266px;
@@ -263,9 +270,11 @@ @@ -263,9 +270,11 @@
263 overflow: hidden; 270 overflow: hidden;
264 271
265 img { 272 img {
  273 + position: absolute;
266 width: 100%; 274 width: 100%;
267 - display: table-cell;  
268 - vertical-align: middle; 275 + left: 0;
  276 + top: 50%;
  277 + transform: translateY(-50%);
269 } 278 }
270 } 279 }
271 280