CSS позиционирование DIV и JQuery slideUp безумие

решаемые Посмотрите на комментарии нижеCSS позиционирование DIV и JQuery slideUp безумие

<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 

    $('#playlistToggle').click(function(event) { 

     event.preventDefault(); 

     if($('#playlist').is(":hidden")) 
     { 
      $('#playlist').slideUp('medium'); 
     } 

     else 
     { 
      $('#playlist').slideDown('medium'); 
     } 

    }); 

}); 
</script> 

<style type="text/css"> 
    #playlist_wrapper 
    { 
     bottom: 30px; 
     height: 75px; 
     overflow: hidden; 
     position: fixed; 
     width: 100%; 
     background-color: yellow; 
    } 

     #playlist 
     { 
      background-color: #FF6633; 
      border: 1px solid #666666; 
      height: 75px; 
      width: 920px; 
      position: relative; 
      bottom: 0; 
      margin: 0 auto; 
      visibility: hidden; 
     } 
</style> 

</head> 

<a href="#" id="playlistToggle">Toggle Playlist</a> 

<div id="playlist_wrapper"> 
    <div id="playlist"></div> 
</div>

Этот сценарий должен скользить вверх списка воспроизведения DIV, когда вы нажмете кнопку. Однако ничего не происходит, когда вы ударяете его. Если вы меняете:

если (. $ ('# Плейлиста') есть (": скрытый"))

To:

если ($ ('# плейлиста'). («: видимый»))

и изменить свойство видимости CSS #playlist от «скрытого» на «дисплея», то ДИВ скользит вверх к вершине, и скользит вниз на дно, то прямо противоположное тому, что я хочу. Что я здесь делаю неправильно?

EDIT: Чтобы уточнить: мне нужно, чтобы список воспроизведения был скрыт от начала, а затем сдвигался, когда я нажимаю кнопку переключения.

источник

2011-02-03 soren.qvist

Объект только conisdered скрыт, если

* They have a CSS display value of none. 
* They are form elements with type="hidden". 
* Their width and height are explicitly set to 0. 
* An ancestor element is hidden, so the element is not shown on the page.

Оно не кажется, что #playlist соответствует любому из этих критериев, так что поэтому селектор не соответствует на #playlist. Можете ли вы покончить с частью .is(':hidden') и сделать это без него?

источник

2011-02-03 23:00:58 Jeff

#playlist необходимо скрывать с самого начала, а затем сдвигать снизу снизу. Я не вижу другого способа скрыть плейлист с самого начала, кроме определения его в свойствах css –

.slideUp является синонимом .hide (хотя и с различными настройками для того, как будет получен эффект)

также

.slideDown является синонимом .show

все 4 только предустановленные анимации.

Если вы читаете документацию JQuery для slideUp и slideDown они идут так:

slideUp:

Описание: Скрыть совпавшие элементы с скользящим движением.

slideDown:

Описание: Дисплей совпавших элементов с скользящим движением.

Ergo: Используйте slideDown, чтобы сделать вещи видимыми и не slideUp

источник

2011-02-03 22:59:15

Если я верну свои функции в выражении 'if', он ничего не делает? –

Вы не можете использовать slideDown (функция show), чтобы сделать что-то слайд вверх от нижней части экрана, вот ваша проблема. Вы должны переосмыслить то, что делаете. –

Я нашел решение. Вместо этого вместо этого вместо этого был заменен оберткой вместо плейлиста. –

CSS позиционирование DIV и JQuery slideUp безумие

ответ

Смежные вопросы