How to use More and less buttons functionality in the PDP page description

using this script method we can achieve expand and show lesson the description by using more and less buttons under the description.

$('.product-details-full-feature-more').click(function() {
            if ($('.product-line-specific-value').height() > 190) {
                $('.product-details-full-feature-content-full').addClass('product-details-feature-expand');
                $('.product-details-full-feature-more').addClass('product-details-hide-me');
                $('.product-details-full-feature-less').removeClass('product-details-hide-me');
            }
        });
        $('.product-details-full-feature-less').click(function() {
            $('.product-details-full-feature-content-full').removeClass('product-details-feature-expand');
            $('.product-details-full-feature-more').removeClass('product-details-hide-me');
            $('.product-details-full-feature-less').addClass('product-details-hide-me');
        });
        $('.product-details-full-accessories-more').click(function() {
            $('.product-details-full-panel-body-recommended').addClass('product-details-accessories-expand');
            $('.product-details-full-accessories-more').addClass('product-details-hide-me');
            $('.product-details-full-accessories-less').removeClass('product-details-hide-me');
        });
        $('.product-details-full-accessories-less').click(function() {
            $('.product-details-full-panel-body-recommended').removeClass('product-details-accessories-expand');
            $('.product-details-full-accessories-more').removeClass('product-details-hide-me');
            $('.product-details-full-accessories-less').addClass('product-details-hide-me');
        });

Leave a comment

Your email address will not be published. Required fields are marked *