Question

我正在使用jquery插件dotdotdot来创建'...阅读更多＆gt;＆gt;'在一段文字之后。当用户点击链接（“阅读更多＆gt;＆gt;”）时，div必须展开，以便整个文本可见。第一部分很有效，但我无法弄清楚第二部分。

这是我的代码：

<script type="text/javascript" language="javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="js/jquery.dotdotdot.min.js"></script>
<script type="text/javascript" language="javascript">
        $(function() {
            $('#dot3').dotdotdot({
                after: 'a#test'

            });
        }); 
<style type="text/css" media="all">
        div.example {
            padding: 0 0 150px 0;
        }
        div.example:after {
            content: '';
            display: block;
            clear: both;
        }
        div.r {
            width: 275px;
        }
        div.box {
            border: 1px solid #ccc;
            height: 160px;
            padding: 15px 20px 10px 20px;
            overflow:visible;
        }
</style>
<div class="example">
            <div class="r">
                <div class="box after" id="dot3">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
                    <a href="#" id="test" onClick="">Read more &raquo;</a></div>
            </div>
        </div>

Answer 1

只需调用destroy，然后调整div的大小。尝试

$("#test").click(function() {
    var div = $('#dot3');
    div.trigger('destroy');
    div.css("height", "auto");
});

Here is fiddle.

将父母的身高改为孩子的身高

1 个答案: