jQuery fadeOut не променя свойството на дисплея

На http://judi.simpleupdates.com/ се опитвам да направя слайдшоу от изображения на страница, използвайки ефектите jQuery fadeIn и fadeOut. И двата елемента fadeIn без проблем. Въпреки това, fadeOut не променя свойството display на div, което трябва да изчезне. Някакви идеи защо това може да не работи според очакванията?

Това е редът, който е неуспешен:

$( ".carousel_item:nth-child(" + selected + ")" ).fadeOut(600);

АКТУАЛИЗАЦИЯ: Проблемът изглежда е с fadeOut на елемент, който няма width и height. Когато се добавят стойности към свойствата width и height на div.carousel_item, извикването fadeOut работи правилно. Друг метод е да премахнете position: absolute от наследника img, което кара div да нарасне до размерите img.


jquery slideshow fadein fadeout
person tiny sauce    schedule 08.06.2011    source източник
comment
Можете ли да предоставите няколко реда код от вашето приложение?   -  person Dan Croak    schedule 08.06.2011
comment
можете ли да премахнете коментара на изчезването, за да можем да го тестваме   -  person mightyplow    schedule 08.06.2011
comment
въпросният код вече е активен. съжалявам за това :P   -  person tiny sauce    schedule 08.06.2011

Отговори (3)


arrow_upward
1
arrow_downward

проблемът изглежда е с fadeOut на елемент, който няма width и height. когато се добавят стойности към свойствата width и height на div.carousel_item, извикването fadeOut работи правилно. друг метод е да премахнете position: absolute от наследника img, което кара div да нарасне до размерите img.

благодаря за цялата ви помощ и предложения!

person tiny sauce    schedule 08.06.2011

arrow_upward
0
arrow_downward

възможно ли е просто да замените текущите и избраните променливи една с друга в jQuery-селектора? когато разбирам правилно, искате да затъмните текущия и да затъмните избраното, нали?

person mightyplow    schedule 08.06.2011
comment
не, current е div, което трябва да се покаже, а selected е елементът, който трябва да изчезне, въпреки че харесвам вашето предложение за превключване на имената на променливите, ако това се прави в целия файл. - person tiny sauce; 08.06.2011

arrow_upward
0
arrow_downward

Промяната на настройката за показване в HTML на <div id="txt2" class="carousel_item" style="display: none; "> трябва да задейства правилно fadeIn/fadeOut.

Може също да се наложи да промените jQuery на: $( ".carousel_item:nth-child(" + selected + ")" ).fadeOut(600).hide();

Извиквате fadeIn/fadeOut на елементи, които са зададени на display: block. Нуждае се от алтернативни състояния, за да работи.

АКТУАЛИЗАЦИЯ След като изтеглите локално копие на вашия сайт, промяна на функцията showhide() във вашия js на:

var inc = 1
function showhide(current) {
    if (inc == 1) current = 2;
    $( ".carousel_item:nth-child(" + selected + ")" ).fadeIn(600);
    $( ".carousel_item:nth-child(" + current + ")" ).fadeOut(600).hide();
    selected = current;
    inc++;
}

работи в моето тестване. Надяваме се, че работи за вас. Добавих брояча, тъй като първоначалният ви брой изглежда задава както selected, така и current на 1.

person g_thom    schedule 08.06.2011
comment
всички div с класа .carousel_item вече са настроени да показват: няма; във външния css файл. свойството display се променя на блокиране само след като fadeIn е извикан на този конкретен div. аз също се опитах да задам стойността в линия, без да реша проблема. - person tiny sauce; 08.06.2011
comment
това предложение ми свърши работа. единственият проблем е, че ако се добавят повече елементи към слайдшоуто (контролирано от клиента), то няма да работи. така че вашето решение е правилно предвид информацията, която сте имали. окончателно решение, обсъдено по-горе. - person tiny sauce; 08.06.2011