Lorem Ipsum Generator - 在单独的div中生成ipsum show的方法

时间:2013-11-20 18:06:38

标签: javascript jquery html css lorem-ipsum

因此,对于我的设计类,我正在创建一个Lorem Ipsum生成器。因为带有滚动条的固定文本区域并不是所有美学上令人愉悦的,所以我试图找到一种方法将它放在我可以让我生成的lorem ipsum出现在一个单独的div中,然后随着内容扩展。 / p>

Cupcake Ipsum这样做,但我在HTML / CSS中的知识可能被认为是在平庸的范围内,我不太了解JS。从我看到他们已经使用某种小部件(或至少在代码中曾经提到过)来获取它,以便他们将生成的代码显示在一个单独的div中?

无论如何还是有任何可用的教程可以告诉我如何在没有他们使用的小部件的情况下完成这项工作?我一直在寻找和达到死胡同,所以我不知道我是不是在正确的地方搜索或者是什么。

所以,TL; DR :尝试制作lorem ipsum生成器。试图将生成的文本显示在带有丑陋滚动条的文本区域中,但在单独的div中。平庸的HTML / CSS知识,很少有JS知识。帮助

1 个答案:

答案 0 :(得分:2)

确保将你的lorem ipsum字符串放在div中,而不是放在textarea中。

默认情况下,Divs根据内容大小(无滚动条)展开。如果您看到滚动条,请将此css应用于您的div:

#lorem_ipsum_div
{
overflow:visible;
}

将字符串放入div中的代码:

<div id='lorem_ipsum_div'></div>
<script>
    $('#lorem_ipsum_div').html(YOUR LOREM IPSUM STRING); //works only if using jQuery
    //if no jQuery, use this: 
    //document.getElementById("lorem_ipsum_div").innerHTML=YOUR LOREM IPSUM STRING;
</script>