MyBB Community Forums

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

really good work rakes....

(2014-12-09, 12:32 PM)Leefish Wrote: [ -> ]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.

Plugin would be better. I will wait then

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.

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

(2015-01-15, 05:48 PM)Eldenroot Wrote: [ -> ]So just add these css into global.css and script into header?

Yeh

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

(2015-01-15, 07:59 PM)Eldenroot Wrote: [ -> ]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

@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!