fadeIn вызывается при обратном вызове мигания или повторения fadeOut на определенных элементах? - PullRequest
Новая
       16

fadeIn вызывается при обратном вызове мигания или повторения fadeOut на определенных элементах?

0 голосов
/ 24 апреля 2011

Я использую элемент формы select, чтобы показать разные дни для расписания. По какой-то причине третий и четвертый дни мигают при выборе, и я не знаю почему. А если выбран третий или четвертый день, другие дни будут мигать при выборе.

Пример доступен здесь: http://jsfiddle.net/waffl/WBHQc/1/

HTML: 

<select id="date-select" name="date">
    <option value="day1" selected="selected">Thursday</option>
    <option value="day2">Friday</option>
    <option value="day3">Saturday</option>
    <option value="day4">Sunday</option>
</select>

<div id="schedule">
    <div id="day1"><img src="http://placehold.it/350x150"></div>
    <div id="day2"><img src="http://placehold.it/350x150/ff00000"></div>
    <div id="day3"><img src="http://placehold.it/350x150/37FDFC"></div>
    <div id="day4"><img src="http://placehold.it/350x150/FFC125"></div>
</div>

CSS: 

#day2, #day3, #day4 {
    display: none;
}

JS: 

$('#date-select').change(function() {
    var newDay = $(this).val();
    $("#schedule > div").fadeOut(200,function() {
        $("#schedule #"+newDay).fadeIn();
    });
});

Ответы [ 2 ]

1 голос
/ 24 апреля 2011

Похоже, проблема связана со временем.Использование #schedule > div в качестве селектора приводит к тому, что все элементы div начинают исчезать, а затем каждый из них вызывает fadeIn элемента div.Для наиболее простого решения я бы, вероятно, просто кешировал текущий выбранный div и затем использовал его для постепенного исчезновения (только один, а не все):* Скрипка здесь

0 голосов
/ 24 апреля 2011 
$('#date-select').change(function() {
    var newDay = $(this).val();
    $("#schedule").find('div:visible').fadeOut(200).end().find("#"+newDay).delay(200).fadeIn(200);
});

Проверьте рабочий пример на http://jsfiddle.net/MNXvK/1/

...