1.8 Expand long quotes

[Leefish]

It looks good; I have not tested Rakes' code with multiple instances, but it looks like it should work.

[mmadhankumar]

really good work rakes....

[Rakes]

This user has been denied support.

It looks good; I have not tested Rakes' code with multiple instances, but it looks like it should work.

My first code was written for multiple instances, second too but mmad kinda removed it.
You'll just need a div around it and another selector under it as i was too lazy to use :after.

I could probably make an actual plugin that checks the amount of lines instead of depending so much on js that tends to slow down stuff.

[Eldenroot]

Plugin would be better. I will wait then

[Rakes]

This user has been denied support.

Anyways back to this.

Here,

Style:

    .q-collapsed {
        overflow: hidden;
        max-height: 150px;
        position: relative;
        padding-bottom: 25px;
    }
    .q-collapsed:after {
        -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;
        position: absolute;
        height: 80px;
        content: 'Show More';
        bottom: 0px;
        left: 1px;
        right: 1px;
        font-size: 11px;
        line-height: 1;
        text-align: center;
        color: rgb(226, 79, 68);
        cursor: pointer;
        padding-top: 65px;
        background: -webkit-linear-gradient(top, rgba(255, 244, 244, 0) 0%, rgb(244, 244, 244) 70%);
        background: -moz-linear-gradient(top, rgba(255, 244, 244, 0) 0%, rgb(244, 244, 244) 70%);
        background: -o-linear-gradient(top, rgba(255, 244, 244, 0) 0%, rgb(244, 244, 244) 70%);
        background: linear-gradient(to bottom, rgba(255, 244, 244, 0) 0%, rgb(244, 244, 244) 70%);
        -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -khtml-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px;
        -webkit-border-bottom-right-radius: 4px; -moz-border-radius-bottomright: 4px; -khtml-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px;
    }

Script:

    jQuery(document).ready(function(x) {
        x('blockquote').each(function() {

            var a = this,
                e = function() {
                    if (a.offsetHeight > 250) {
                        x(a).addClass('q-collapsed').click(function() {
                            x(a).off("click").removeClass('q-collapsed');
                        });
                    }
                };

            e();

            x(this).on("elementResized", e).find("img").one("load", e);
        });
    });

Cuz the quotes are hardcoded it's a pain to edit files.

[Eldenroot]

So just add these css into global.css and script into header?

[Rakes]

This user has been denied support.

So just add these css into global.css and script into header?

Yeh

[Eldenroot]

Not working for me - quotes are not affected (it has over 500px but no show/hide)

[Rakes]

This user has been denied support.

Not working for me - quotes are not affected (it has over 500px but no show/hide)

Make sure it's under the jquery intake.
Open the chrome console; reload, do you see any errors?
Also can you provide me the url

[Eldenroot]

@Rakes - sorry for late reply but I missed it. No, no errors, it is not working. Could you provide me how to guide? I tried everything, thank oyu!