Show Thread Enhancements - Quote Expander / Collapse - By Technidev

Mark as installed = get support.

If you're tired of people quoting long posts and having to scroll past it, then this modification is definitely something you want to use.

This template modification will make it possible to resize quote containers and add an "Expand" button to it which can be clicked to view the whole quote.

This modification should work on pretty much all vBulletin 4 versions.

Installation

1. Open the "showthread" template and paste the following above </body>
   

   <script>window.jQuery||document.write(unescape("%3Cscript src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));</script>
   <script>
   $(function(){
      $(".quote_container").each(function(index){
         if($(this).height() > 250){
            $(this).css({
               'height': '250px',
               'overflow': 'hidden'
            });
   
            $(this).parent().append('<div class="quote_expander"><a href="">Expand</a></div>'); 
         }
      });
   
      $(".quote_expander").click(function(){
         $(this).parent().find('.quote_container').css({'height': 'initial', 'overflow': 'initial'});
         $(this).remove();
         return false;
      });
   });
   </script>

2. Now open the additional.css template under "CSS Templates" and add the following:
   

   .quote_expander{
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     -ms-box-sizing: border-box;
     box-sizing: border-box;
     font-size: 11px;
     text-align: center;
     color: rgb(63, 63, 63);
     cursor: pointer;
     padding-top: 65px;
     background: -webkit-linear-gradient(top, rgba(45, 45, 45, 0) 0%, #C2CAD2 80%);
     background: -moz-linear-gradient(top, rgba(45, 45, 45, 0) 0%, #C2CAD2 80%);
     background: -o-linear-gradient(top, rgba(45, 45, 45, 0) 0%, #C2CAD2 80%);
     background: linear-gradient(to bottom, rgba(45, 45, 45, 0) 0%, #C2CAD2 80%);
     width: 100%;
     position: absolute;
     bottom: 0;
   }

3. Done.

How to change the height of when the quote should be resized?
Change the 2 occurences of the number "250" in the showthread template to whatever height you want.

How to change the background color of the expander?
Change all occurences of the color "#C2CAD2" in the additional.css template to the hex code of the color you want.

Screenshots

[iamme_meisi]

Installed and working great!

[iyihost]

l want to 3.8.x
who can hep me ?

[ramesh_umk3]

Originally Posted by iyihost

l want to 3.8.x
who can hep me ?

<script>window.jQuery||document.write(unescape("%3Cscript src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js' type='text/javascript'%3E%3C/script%3E"));</script>
<script>
$(function(){
   $(".quote").each(function(index){
      if($(this).height() > 250){
         $(this).css({
            'height': '250px',
            'overflow': 'hidden'
         });

         $(this).parent().append('<div class="quote_expander"><a href="">Expand</a></div>'); 
      }
   });

   $(".quote_expander").click(function(){
      $(this).parent().find('.quote').css({'height': 'initial', 'overflow': 'initial'});
      $(this).remove();
      return false;
   });
});
</script>

Should Work with vB 3.8

Try once.

Thanks.

[Mellow]

Nice, works great thanks... would be nice to have a contract on the expanded quote but this is nice enough.

[Hostboard]

Vbulletin 4 has a "Use Remote jQuery" with; Google, jQuery, and Microsoft. being listed.
Your using CloudFlare jQuery 2.2.0
Any reason why you did not default to one of the built in selections? Are there any performance enhancements between any of these? Would it be worth while to add Cloudflare to the available default configuration list? Could not be too difficult... Will vBulletin 4.2.x run under jQuery 2.2.0?

Would be nice to have a collapse option once expanded