Почему эта строка 'переходит', когда я называю slideDown?
С тех пор существует много кода, я не отправлю его здесь. Скорее можно найти все это здесь. Тем путем можно играть вокруг с ним и выполнить его:
function P_Expand(item_id) {
$('#p_' + item_id).slideToggle();
}.data_table {
width: 650px;
margin-left: auto;
margin-right: auto;
border-collapse: collapse;
}
.data_table tbody th {
border-bottom: 1px solid #555;
text-align: left;
}
.data_table tbody tr td a {
color: #8b9cb0;
text-decoration: none;
}
.hidden_data {
display: none;
padding: 10px;
font-style: italic;
color: #777;
}
Drop me down!
...
...
Donec dolor urna, vehicula in elementum eget, auctor dignissim nibh. Morbi et augue et nisi.
Line number 2...
...
...
Проблема происходит, когда 'Раскрывают меня!' на ссылку нажимают. DIV скатывается как ожидалось, но делает внезапный 'переход' прямо в конце.
Почему это делает это, и как я могу заставить его уйти?
3 ответа
демонстрация
.hidden_data {
overflow: hidden;
display:none; /* <--- remove this */
padding: 10px;
font-style: italic;
color: #777;
}
похожая проблема решена
Дать скрытый div заданную высоту. jsfiddle
Править. Нашел несколько ответов здесь . Вы можете сохранить высоту каждого элемента, а затем применить ее повторно. Не идеально для вашей ситуации, но может быть отправной точкой
На самом деле вам это не нужно. Просто задайте ширину скрытому элементу:
.hidden_data {
display: none;
padding: 10px;
font-style: italic;
color: #777;
width: 300px;
}
Это будет работать!
PS: Я провел на этом все выходные ...