В дополнительной функции Accordion Text есть проблема с названием.
Автор: Дмитрий Тулупов
Просмотрено 1730,
Подписчики 1,
Размещенный 0
Купил Accordion Text, чтобы скомпоновать большое количество текста. Удобная "гормошка" , но я столкнулся с проблемой.
В зоголовке раскрывающегося текста, нет возможности для длинных приложений. Только 2-3 слова. Эта функция не умеет переносить заголовок на 2,3 строки, а имеет одну строку. По этой причине текст получается обрезанный.
В раскрывающемся тексте таких проблем не наблюдается а в заголовке эта проблема есть и она сильно напрягает.
Кто знает выход из положения?
Заранее благодарен, Дмитрий.
Размещено
Автор
Дополнение к выше сказанной проблеме.
Оказалось что стиль 5 и 6 умеют переносить на несколько строк название. А мне нужен 3 стиль написание текста. Он не умеет переносить строки в названии и длинный текст получается обрезанный. Особенно в мобильной версии.
Подскажите, как мне выйти с этого положения?
Как выйти - сокращайте описания)
Автор
Нет возможности сократить описание.
Hi Dmitry
Unfortunately, I have to confirm that this is the expected behavior of the mentioned Object.
In order to preserve the same height for each Title block, the size of the text will be limited to a single line exclusively, instead of showing more than one and having a non-coherent continuity in the title space size.
This is how the Object has been currently designed, but several Idea topics have already been opened to suggest possible improvements, and this one is one of those.
As of now, there's no news on this matter, but I can confirm that the need for this change has already been notified to the developers and they're currently aware of this
Thank you for your feedback on the Object as we keep on working to always improve this functionality
Stefano
GOOGLE TRANSLATE ---
Привет Дмитрий
К сожалению, я должен подтвердить, что это ожидаемое поведение упомянутого объекта.
Чтобы сохранить одинаковую высоту для каждого блока заголовка, размер текста будет ограничен только одной строкой, вместо того, чтобы показывать более одной и иметь некогерентную непрерывность в размере пространства заголовка.
Именно так в настоящее время проектируется объект, но несколько тем Idea уже были открыты, чтобы предложить возможные улучшения, и эта - одна из них.
На данный момент нет новостей по этому вопросу, но я могу подтвердить, что о необходимости этого изменения уже было сообщено разработчикам, и они в настоящее время знают об этом
Спасибо за ваш отзыв об объекте, так как мы постоянно работаем над улучшением этой функциональности
Стефано
Вот простой пример "Универсальный спойлер" для WebSite X5 17.0.11 Professional
Используем HTML код:
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №1</h3></div>
<div class="contents">Содержимое внутри спойлера №1<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.
</div>
</div>
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №2</h3></div>
<div class="contents">Содержимое внутри спойлера №2<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.</div>
</div>
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №3</h3></div>
<div class="contents">Содержимое внутри спойлера №3<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.</div>
</div>
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №4</h3></div>
<div class="contents">Содержимое внутри спойлера №4<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.</div>
</div>
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №5</h3></div>
<div class="contents">Содержимое внутри спойлера №5<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.</div>
</div>
<div class="spoiler closed">
<div class="title"><h3 class="title_h3">ЗАГОЛОВОК СПОЙЛЕРА №6</h3></div>
<div class="contents">Содержимое внутри спойлера №6<br>
Lorem ipsum dolor sit amet, consectetur .
Donec commodo sapien dapibus consequat.
Phasellus a sagittis massa.</div>
</div>
Вставьте его, как показано на скриншоте
Используйте код стилей:
<style type="text/css">
.spoiler {
overflow: hidden;
margin-bottom: 10px;
border: 1px solid #bbbbbb;
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
-webkit-box-shadow: 0 0 9px #dddddd inset; /*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/
-moz-box-shadow: 0 0 9px #dddddd inset; /*FF 3.5+*/
box-shadow: 0 0 9px #dddddd inset; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
.title_h3 {
cursor:pointer;
background: #dddddd;
margin: 0 -10px 0 -10px;
padding: 10px;
padding-left: 20px;
border-radius: 7px 7px 0 0;
-moz-border-radius: 7px 7px 0 0;
-webkit-border-radius: 7px 7px 0 0;
-webkit-box-shadow: 0 0 9px #dddddd inset; /*Saf3-4, Chrome, iOS 4.0.2-4.2, Android 2.3+*/
-moz-box-shadow: 0 0 9px #dddddd inset; /*FF 3.5+*/
box-shadow: 0 0 9px #dddddd inset; /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */
}
.closed .contents {
display:none;
}
.closed h3 {
background: #bbbbbb;
}
.contents {
padding: 10px;
}
</style>
Вставьте его, как показано на скриншоте
Используйте скрипт:
<script type="text/javascript">
var BgColorClosed = '#bbbbbb'; /* Фон заголовка спойлера - закрыт */
var BgColorOpen = '#dddddd'; /* Фон заголовка спойлера - открыт */
$(".closed").toggleClass("show");
$(".title").click(function(){
$(this).parent().toggleClass("show").children("div.contents").slideToggle("medium");
if ($(this).parent().hasClass("show"))
$(this).children(".title_h3").css("background",BgColorClosed);
else $(this).children(".title_h3").css("background",BgColorOpen);
});
</script>
Вставьте скрипт, как показано на скриншоте
Сам проект здесь