Slidetoggle () - проблема с переключением вверх и вниз
У меня проблема с slidetoggle().
Скажем, у меня есть div с некоторыми отличными иконками шрифтов. Когда я нажимаю на них, текст в этом div скользит вверх / вниз, но это не проблема.
<div id = "textbox">
<li class = "something"><i class = "fa fa-something"></i></li> |
<li class = "somethingelse" <i class = "fa fa-somethingelse"></i></li>
</div>
При нажатии значка 1 или 2 происходит переключение текста:
<p id"text1">text1</p> or <p id = "text2">text2</p>
а jQuery, который я использую для переключения различного контента при нажатии, -
$(function() {
$('.something').click(function(e) {
$('#text1').slideToggle(1800);
});
});
$(function() {
$('.somethingelse').click(function(e) {
$('#text2').slideToggle(1800);
});
});
И он работает как шарм, переключаясь при нажатии на значок.
Но если я не «закрою» переключатель, щелкнув значок (я щелкнул, чтобы «отобразить» p), а щелкнул другой значок, он переключается поверх того, который уже отображается.
Можно ли переключить-закрыть текст, который уже отображается автоматически при щелчке по другому значку, перед - содержимое второго переключается? Если да, то как?
Ответы 2
изменить id $ ('# text1') на $ ('# text2');
$ (function () {
$ ('. somethingelse'). click (function (e) { $ ('# текст2'). slideToggle (1800);
});
Решил, добавив "slideUp ()" при нажатии:
$(function() {
$('.something').click(function(e) {
$('#text1').slideToggle(1800);
$('#text2').slideUp(1800);
});
});
и наоборот
$(function() {
$('.something').click(function(e) {
$('#text2').slideToggle(1800);
$('#text1').slideUp(1800);
});
});
Я не могу перестать бить себя по голове прямо сейчас, за то, что не подумал об этом сразу ..
нужно еще кофе .. надо. есть.больше. кофе ...
Извините ребята ;)
вы можете использовать аккордеон jQueryUI