Question

我想开发一个稳定的网页，可以很好地适应所有屏幕尺寸，包括移动设备。我的想法是创建一个脚本来检查div中的文本长度。如果它包含：

少于或等于20个字，使div小
21到500字之间使div正常
超过500字最大的div。

我还想使用切换来隐藏内容，但目前它还可以。我正在使用同位素垂直堆叠div。并从mysql数据库查询加载文本。我希望内容较少的文章可能是链接或youtube视频显示在较小的框中，而普通和大文章显示大到足以避免在达到可理解的最大尺寸之前看到滚动条。我必须找到一种处理它的方法，而不会破坏网站的形状。

有人可以告诉我我该做什么吗？

Answer 1

制作你的div height:auto，以便添加到div中的文字越多，它们就越大。

或者如果你想使用jQuery

$('div').each(function(){
    if($(this).text().length < 80){
        //small
        $(this).height(50);
    }else if($(this).text().length < 2000){
        //mid
        $(this).height(150);
    }else{
        //large
        $(this).height(350);
    }
});

我使用字符作为限制而不是单词，因为单词的长度不可靠。如果你想使用单词，你将不得不拆分空格或使用正则表达式，但你会发现最终结果不会令人满意

jquery：根据文本长度使div大或小

1 个答案: