Технический сбой

Сайт временно работает в режиме только для чтения, идут восстановительные работы. Приносим свои извинения за неудобства.
DLE FAQ » Все вопросы » jQuery » Работа скрипта сворачивания текста в DLE

Работа скрипта сворачивания текста в DLE

     категории, javascript, хаки    jQuery, Хаки    4096

вопрос
Здравствуйте. Не хотел задавать вопрос отдельно, задал сначала тут, но никто не ответил. Суть вот в чем, там(по ссылке) есть линк на джава скрипт который сворачивает текст с превышением длины текста. Столкнулся с такой проблемой: этот джава скрипт действует только на последнюю в списке новость. У меня же есть отдельная категория, с отдельной ТПЛкой, соответственно я прописываю сам джава скрипт в эту ТПЛку, но сворачивается только последняя новость в выводимом списке новостей категории. При этом сама кнопка рисуется во всех новостях, но текст не разворачивается, хотя кнопка меняет название. А вот в последней новости из списка норм с этим. Может я где не там скрипт располагаю, что он действует в полной мере только на одну новость?
Спасибо.

Ответа пока нет

 

10 комментариев

D0Gmatist
Юзер

D0Gmatist - -

Да всё правильно и еще вон в той строке пробел пропустил, и кавычки одинарные ниже ...
Мы же тут все шаманы... с бубнами сидим и телепатически видим и код и где в нём ошибка
Serhio
Юзер

Serhio - -

Виноват, приношу извинения что код не вставил. вот он джававский:
if ($('.wrap').length) {
    $('.wrap').each(function (e) {
        var hght = $(this).height();
        $(this).data('height', hght);
        if (hght > 250) {
            $(this).addClass('moder_collapsed').after('<span class="btn btn-expand" title="Текст слишком большой и поэтому он свёрнут!">Развернуть текст</span>');
        };
    });
    $(document).on('click', '.btn-expand', function () {
        var ths = $(this);
        var prevEl = ths.prev('.moder_collapsed');

        if (ths.hasClass('expanded')) {
            prevEl.animate({
                    height: '250'
                },
                1400, function () {
                    ths.text('Развернуть текст').removeClass('expanded');
                });
        }
        else {
            prevEl.animate({
                    height: prevEl.data('height')
                },
                1400, function () {
                    ths.text('Свернуть текст').addClass('expanded');
                });
        };

    });
};


Вот ксс:
.moder_collapsed {
  height: 250px;
  overflow: hidden;
}
.btn {
  display: inline-block;
  padding: 5px;
  background: #f96;
  color: #fff;
  cursor: pointer;
}


А вот в тплке отдельной под категорию, вокруг шортстори пишу <div class="wrap">{short-story}</div>
D0Gmatist
Юзер

D0Gmatist - -

Ошибка не в этом коде ... он работает исправно

http://jsfiddle.net/D0Gmatist/A4n82/
Serhio
Юзер

Serhio - -

Я понимаю что не в коде, потому и спрашиваю, где может быть причина того что верхние новости не хотят разворачиваться? Разделители в КСС? Еще что-то? Что может ограничивать развертку текста в верхней новости? Причем простая новость, без сворачивания, вполне себе уживается под новостью с разверткой. Ну то бишь, той последней у которой работает.
D0Gmatist
Юзер

D0Gmatist - -

Единственное попробуйте js прописать в шапке вот так

<script type="text/javascript">
$(window).load(function() {
    if ($('.wrap').length) {
        $('.wrap').each(function(e) {
            var hght = $(this).height();
            $(this).data('height', hght);
            if (hght > 250) {
                $(this).addClass('moder_collapsed').after('<span class="btn btn-expand" title="Текст слишком большой и поэтому он свёрнут!">Развернуть текст</span>');
            };
        });
        $(document).on('click', '.btn-expand', function() {
            var ths = $(this);
            var prevEl = ths.prev('.moder_collapsed');
            if (ths.hasClass('expanded')) {
                prevEl.animate({
                    height: '250'
                }, 1400, function() {
                    ths.text('Развернуть текст').removeClass('expanded');
                });
            } else {
                prevEl.animate({
                    height: prevEl.data('height')
                }, 1400, function() {
                    ths.text('Свернуть текст').addClass('expanded');
                });
            };
        });
    };
});
</script>
Serhio
Юзер

Serhio - -

Попробовал, даже последняя перестала разворачиваться. Но опять же, название кнопки меняется, но разворачивание текста не следует.
D0Gmatist
Юзер

D0Gmatist - -

Я как то сюда уже делал такую хрень .. самый лучший способ вот


http://jsfiddle.net/D0Gmatist/cGZ5D/

где id_1 это можно взять id_{news-id}
Serhio
Юзер

Serhio - -

Спасибо, попробовал. Оно заработало, но теперь действует только на верхнюю новость. То есть под другими новостями кнопка появляется, но разворачивается и сворачивается по нажатию любой из них всегда самая верхняя... Да чтож такое...
Плюс кнопка появляется там где не нужно разворачивать текст. Хотя понятно что это легко фиксится, но все же проблема не в этом...
D0Gmatist
Юзер

D0Gmatist - -

Вам нужно и кнопку править
JS
<!--
function showHide (id) {
    var style = document.getElementById("form_" + id).style
    if (style.height == "100px") {
        style.height = "auto";
    } else {
        style.height = "100px";
    }
} 
 -->


<button class="button" type="submit" onclick="showHide('id_{news-id}');">рашь по мне</button>
<br /><br />
<div class="form_polu_spoiler" id="form_id_{news-id}" style="height: 100px;">вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты...  вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты...  </div>
<br />
<button class="button" type="submit" onclick="showHide('id_{news-id}');">или по мне</button>

<br /><br /><br />
СЛЕДУЮЩИЙ ПОСТ И НОВЫЕ {news-id}
<br /><br /><br />

<button class="button" type="submit" onclick="showHide('id_{news-id}');">рашь по мне</button>
<br /><br />
<div class="form_polu_spoiler" id="form_id_{news-id}" style="height: 100px;">вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты...  вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты... вот это да вот она рыбо моей мечты...  </div>
<br />
<button class="button" type="submit" onclick="showHide('id_{news-id}');">или по мне</button>
Serhio
Юзер

Serhio - -

Ай, я дурак, Вы же об этом писали, а я забыл, пока прописывал. Спасибо, действительно заработало. Еще бы это плавно все это разворачивалось сделать и убрать кнопку, если она она не нужна... Я полный 0 в Джаве пока, но я думаю как-нибудь попробую разобраться. И так уже наверное замучал :) Еще раз спасибо!

Похожие вопросы

 03.01.2013 maggotische  jQuery
 16.01.2013 maggotische  Шаблоны (TPL), jQuery, Общие вопросы по PHP
 02.08.2013 bpetruk007  Общие вопросы по вёрстке, Шаблоны (TPL), jQuery
 16.02.2014 TTATPuOT  Общие вопросы, Шаблоны (TPL), jQuery
 25.03.2014 TTATPuOT  Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS), jQuery
 01.08.2014 skynet32rus  jQuery
 09.08.2014 lGaaral  Общие вопросы, jQuery
 23.03.2015 skaWizer  jQuery, Хаки
 02.04.2015 skaWizer  jQuery, Хаки
 15.05.2015 cracken  jQuery
  • Puxlik | Telegram Sender 13
    Фото Puxlik
    Puxlik
    Telegram Sender
    Версию 17.1 поддерживает ?
  • TeraMoune | Не загружается изображение [Ошибка HTTP] ... 2
    Фото TeraMoune
    TeraMoune
    Не загружается изображение [Ошибка HTTP]. Как исправить?
    В этой версии есть фрагментация загрузки файла когда загружаемый файл разделяется на фрагменты, по умолчанию 1 фрагмент 1.5мб. (И у вас написано лимиты на файл 4мб и картинки 5.86мб, этого достаточно чтобы принимать 1.5мб фрагменты) И если бы была проблема с весом или чем-то подобным то об этом бы сервер сообщил. Сервер отдал 500 ошибку это значит что угодно, нужно смотреть ответ от сервера в консоли разработчика или логах.
  • RedFox | Не загружается изображение [Ошибка HTTP] ... 2
    Фото RedFox
    RedFox
    Не загружается изображение [Ошибка HTTP]. Как исправить?
    "Некоторые картинки загружаются, но большинство нет."

    Сначала не обратил внимания, но видимо проблема в этом. Все, что больше 100Кб, не загружается. Что странно, поскольку в php у меня следующие значения:
    post_max_size = 100M
    upload_max_filesize = 100M
    max_file_uploads = 20

    Полагаю, где-то еще надо увеличить размер загружаемой картинки, но где?
  • LMakc | Модуль читалка pdf 1
    Фото LMakc
    LMakc
    Модуль читалка pdf
    Не начинай, я заплатил сегодня штраф за підручники. Сейчас очень сложно с этим.
  • ssssss | Сделать подсчет количества символов в ко ... 5
    Фото ssssss
    ssssss
    Сделать подсчет количества символов в комментариях
    Есть актуальный плагин под 17 версию? (только количество символов! без наворотов... записей куда-либо и т.п.) *ББ-редактор
  • alex.sg.spb | Как вывести информацию о обновлении ново ... 8
    Фото alex.sg.spb
    alex.sg.spb
    Как вывести информацию о обновлении новости, но на время?
    вопрос, в продолжение поста. Помогите с кодом вывода инфо UPDATE на краткой новости, так чтобы не нужно было нажимать внутри новости при редактировании галочку?
  • Kentavr | Как вместо %20 в адресной строке подстав ... 9
    Фото Kentavr
    Kentavr
    Как вместо %20 в адресной строке подставлять символ + между словами ???
    Спасибо огромное. Этот вариант самый простой и рабочий!
  • derebas | Как вместо %20 в адресной строке подстав ... 9
    Фото derebas
    derebas
    Как вместо %20 в адресной строке подставлять символ + между словами ???
    К черту htaccess давайте проще

    к href добавьте id="xfield_value"
    <a href="/company/[xfvalue_company]/" id="xfield_value">[xfvalue_company]</a>

    И добавьте скрипт обработчик 
    <script>
document.addEventListener('DOMContentLoaded', function() {
    const links = document.querySelectorAll('a#xfield_value');

    links.forEach(link => {
      let href = link.getAttribute('href');

      if (href) {
        href = href.replace(/ /g, '+');
        link.setAttribute('href', href);
      }
    });
  });
</script>
  • Kentavr | Как вместо %20 в адресной строке подстав ... 9
    Фото Kentavr
    Kentavr
    Как вместо %20 в адресной строке подставлять символ + между словами ???
    Так сайт не работает вообще. Браузер выдает такое

    Страница недоступна Сайт ... выполнил переадресацию слишком много раз.
    Попробуйте удалить файлы cookie.

    ERR_TOO_MANY_REDIRECTS

    Куки чистил не помогает
  • derebas | Как вместо %20 в адресной строке подстав ... 9
    Фото derebas
    derebas
    Как вместо %20 в адресной строке подставлять символ + между словами ???
    Попробуйте так
    RewriteEngine On
    RewriteCond %{REQUEST_URI} %20
    RewriteRule (.*)%20(.*) $1+$2 [N]
    RewriteRule (.*) $1 [R=301,L]
наверх