[For 1.8] Expandable Quotes
Expandable Quotes like Xenforo with no-script support (overflow-y: scroll). This should be, at the moment, the most convenient way to achieve that.

Add in your global.css (possibly at the end):

.mycode_quote {
	position: relative;
	overflow-y: auto;
	max-height: 200px;
	transition: max-height 500ms ease-in-out;

.quote__expand {
	position: absolute;
	bottom: 0; left: 0; right: 0;
	background: linear-gradient(to bottom, rgba(249,250,250,0) 0%, #f9fafa 60%);
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
	text-align: center;
	height: 75px;
	cursor: pointer;

.quote__expand span {
	position: absolute;
	bottom: 10px; left: 0; right: 0;

Go to your footer template, add at the end:

const bbCodeQuoteExpandHtml = '<div class="quote__expand"><span>Click to expand...</span></div>';

const bbCodeQuotes = $('.mycode_quote');
bbCodeQuotes.each(function() {
	if ($(this).parent('.mycode_quote').length) {
		return $(this).css('max-height', 'initial');

	if (this.scrollHeight > this.clientHeight) {
		return $(this).css('overflow', 'hidden').append(bbCodeQuoteExpandHtml)

const bbCodeQuoteExpand = $('.quote__expand');
bbCodeQuoteExpand.on('click', function() {
	const bbCodeQuote = $(this).parent('.mycode_quote');

	bbCodeQuote.css('max-height', bbCodeQuote.prop('scrollHeight'));


<-- snip -->
(2019-08-30, 04:51 PM)vintagedaddyo Wrote: Cool beans, I assume this is does the same as https://community.mybb.com/thread-206116.html ?

Yes, I believe both are same. Smile
@OP: Good work with the plugin.
Seems Awesome thanks for sharing!

Forum Jump:

Users browsing this thread: 1 Guest(s)