jQuery нет исчезать при загрузке страницы - PullRequest
1 голос
/ 04 января 2012

Я создал ваш типичный слайдер jQuery (код здесь ). Все работает отлично, как есть, за исключением того, что я не хочу, чтобы fadeIn() запускался при загрузке страницы (это выглядит странно, поскольку пользователь еще ничего не нажимал) Любые идеи, как это исправить? По сути, я хочу оставить все как есть, за исключением отсутствия затухания при загрузке страницы. Спасибо!

// Tab slides
$(function () {
    var tabContainers = $('div.slider > div');

    $('div.slider ul.slider-nav a').click(function () {
        tabContainers.hide().filter(this.hash).fadeIn();

        $('div.slider ul.slider-nav a').removeClass('selected');
        $(this).addClass('selected');

        return false;
    }).filter(':first').click();
});

Ответы [ 3 ]

1 голос
/ 04 января 2012
// Tab slides
$(function () {
    var tabContainers = $('div.slider > div'),
        loaded = false;

    $('div.slider ul.slider-nav a').click(function () {
        var tab = tabContainers.hide().filter(this.hash);
        if (loaded){
          tab.fadeIn();
        }else{
          tab.show();
        }
        loaded = true;

        $('div.slider ul.slider-nav a').removeClass('selected');
        $(this).addClass('selected');

        return false;
    }).filter(':first').click();
});

Объяснение: Скрипт загружает обработчик щелчков, а затем (после загрузки) вызывает обработчик щелчков, который он только что создал. Из-за этого он исчезнет (так, как это указывает обработчик). Этого можно избежать, добавив проверку (в данном случае переменную loaded), которая, по сути, пропускает первый щелчок без какого-либо вмешательства, но при любых будущих вызовах применяет затухание.

0 голосов
/ 04 января 2012

Ну, ты не можешь просто удалить

tabContainers.hide().filter(this.hash).fadeIn();

0 голосов
/ 04 января 2012

Вы можете установить флаг после первого запуска, который затем проверяется при последующих запусках.

// Tab slides
$(function () {
    var tabContainers = $('div.slider > div');
    var firstRun = true;

    $('div.slider ul.slider-nav a').click(function () {
        tabContainers.hide().filter(this.hash);
        if(!firstRun) { tabContainers.fadeIn(); firstRun = false; }

        $('div.slider ul.slider-nav a').removeClass('selected');
        $(this).addClass('selected');

        return false;
    }).filter(':first').click();
});
...