fadeIn при нажатии кнопки

У меня есть проблема в моем коде. Я пытаюсь показать анимацию загрузки (которую я имею в формате .gif). Единственная проблема заключается в том, что когда я нажимаю кнопку, анимация отображается менее одной секунды, и она исчезает. Что я делаю не так?fadeIn при нажатии кнопки

HTML:

<form action="" method="post"> 
<button id="act">Click me</button> 
</form> 
<div class="loading"></div><!--my Animation-->

Jquery:

$(function() { 
    $(".loading").css("display","none"); 
    $("#act").click(function() { 
     $(".loading").fadeIn("slow"); 
    }); 

    });

Спасибо!

источник

2013-07-05 Or Amranov

вместо «медленного» попробуйте дать значение как 3000 .. это будет миллисекунды .. так что дайте значение соответственно. –

изменение подобный.

$("#act").click(function() { 
$(".loading").css("display", "block").css("opacity", "0"); 
$(".loading").fadeIn("slow"); 
});

источник

2013-07-05 13:05:50 user10

Вы перестанете действие по умолчанию для кнопки (заполните форму завершения заполнения), вам необходимо добавить параметр e функции и остановить действие по умолчанию.

$(function() { 
    $(".loading").css("display","none"); 
    $("#act").click(function(e) { 
     e.preventDefault(); //This will stop it. 
     $(".loading").fadeIn("slow"); 
    }); 

    });

источник

2013-07-05 13:05:58 Skatox

Я собирался опубликовать это после подготовки скрипки - [вот рабочий пример] (http://jsfiddle.net/umjUN/). – freejosh

Большое спасибо! Помог мне много! –

Добро пожаловать :) затем выберите это как ответ. – Skatox

вы можете использовать милисекунд для FadeIn непосредственно

$(".loading").fadeIn(2000);// this will fadin in 2 seconds

источник

2013-07-05 13:06:20

Я не совсем уверен, но я думаю, что дисплей, никто не дает вам неприятности. Скорее всего, это скопируйте код в css и получите его как $ («loading»). Show() или hide(), когда это необходимо. Сначала нажмите, а затем вы можете выбрать, когда скрывать и когда показывать вручную. Более гибкий.

источник

2013-07-05 13:08:20 Delrog

проблема с .show() или .hide() - это анимация. Думаю, ему нужен эффект fadeIn(). –

Вы можете попробовать сыграть со временем, как сказал Бхушан Кавадкар или просто использовать эффект скрыть и fadeIn (миллисекунды здесь), когда вам нужно. – Delrog

добавить встроенный дисплей: нет; стиль для элемента .loading и удалить css («display», «none») из функции

источник

2013-07-05 13:09:16

Хотя решения JQuery очень просты, я бы рассмотрел анимацию CSS3. Они намного более плавные, чем встроенные функциональные возможности fadein.

источник

2013-07-05 13:12:12 user2550807

fadeIn при нажатии кнопки

ответ

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