Поиск по сайту

Всем привет! Решил сделать основательное описание для основных категорий и тк текст очень длинный то визуально это не удобно. Для решения проблемы нашел такой скрипт http://cssdeck.com/labs/full/uq6hvxxy Запихал в stylesheet.css: #block-hidetext{ border-bottom: 1px solid #C3C3C3; height: 200px; overflow: hidden; } #text-tab{ position: absolute; width: 120px; height: 30px; border-top: 1px solid #C3C3C3; border-left: 1px solid #C3C3C3; border-right: 1px solid #C3C3C3; background-color: white; margin-top: -31px; margin-left: 290px; cursor: pointer; } #text-tab p{ text-align: center; margin: 8px 0; } создал файл blockhidetext.js в catalog/view/javascript/ с таким содержанием: $(document).ready(function(){ var sizetext = $('#size-hidetext').height()+35; // Определяем высоту блока с текстом. Фактически определяем высоту текста и прибавляем ещё 35px - это высота ярлычка, чтобы при открытом состоянии ярлычок не заходил на текст.' $('#text-tab').toggle( function() { $('#block-hidetext').animate({'height':sizetext},350); // Плавная анимация к концу блока с текстом. $('#text-tab > p').html("Скрыть"); }, function() { $('#block-hidetext').animate({'height':'200'},350); // По второму нажатию на ярлычок будет происходить анимация вверх до 200px. $('#text-tab > p').html("Раскрыть"); } ); }); подключил его в хедере: <script src="catalog/view/javascript/blockhidetext.js" type="text/javascript"></script> Добавил в category.tpl в выводе описания вот так: <div class="col-sm-10"><div id="block-hidetext"><div id="size-hidetext"><?php echo $description; ?><div id="text-tab" ></div></div><p>Раскрыть</p></div></div> Но на выходи получил все равно вот такую не работающию хрень: http://prntscr.com/bmwx9x