2015-10-08 2 views
0

Я хочу, чтобы полноэкранный загрузочный автомат автоматически всплывал после x секунд (Я также хочу, чтобы он работал как модальная кнопка на странице). У меня есть полноэкранная часть, работающая с кнопкой, но когда я применяю к ней какой-либо новый javascript, он, кажется, отключает кнопку все вместе, и вот где я застрял.Автоматическое открытие Bootstrap через x секунд

Я прочитал документацию по начальной загрузке, w3-школы и т. Д. Я потратил час на Google и здесь, и все, что я могу найти, это закрыть его после x секунд, который здесь не применяется. Это похоже на то, что было бы очень часто использовано. Почему я чувствую, что ищу иглу в стоге сена?

Я попытался добавить это, и это не сработало:

$(document).ready(function() { 

    $("#fsModal").delay(2000).fadeIn(500); 

}); 

Вот мой код: http://jsfiddle.net/nqa1sbko/

Любая помощь очень ценится !!

+2

Добавьте это в 'ready',' SetTimeout (функция() {$ ('# fsModal') модальный ('шоу');.}, 2000); 'Check [Demo] (http://jsfiddle.net/tusharj/nqa1sbko/1/) – Tushar

ответ

0

fadeIn не будет работать, так как мода не открыта. Вы должны вызвать метод modal с опцией show.

$('#fsModal').modal('show'); 

Вы можете использовать его в setTimeout:

setTimeout(function() { 
    $('#fsModal').modal('show'); 
}, 2000); 

Если вы хотите fadeIn анимации, просто указать его в модальных вариантов.

Я отредактировал скрипку: http://jsfiddle.net/nqa1sbko/2/

+1

@downvoter Почему downvote? – Magus

+0

Мне также интересно, почему это проголосовало, это правильно, и я не вижу другого пути +1 – Tushar

+0

Спасибо! Вот как я хотел, чтобы он функционировал! Ответ ниже работает немного по-другому .. у него есть синий экран, который открывается сразу же после x секунд модальный затухает, возможно, я сформулировал свой вопрос неправильно, но это не то, что я искал .. спасибо в любом случае :) –

0

Попробуйте сделать FIDDLE,

Вы должны инициализировать модели без указания «шоу» в качестве параметра, то после того, как вы можете использовать FadeIn апи.

$(function() { 
    // .modal-backdrop classes 
    $(".modal-fullscreen").on('show.bs.modal', function() { 
     setTimeout(function() { 
      $(".modal-backdrop").addClass("modal-backdrop-fullscreen"); 
     }, 0); 
    }); 
    $(".modal-fullscreen").on('hidden.bs.modal', function() { 
     $(".modal-backdrop").addClass("modal-backdrop-fullscreen"); 
    }); 


    $('#fsModal').modal().fadeIn(1000); // Here x = 1000 

}); 

Благодаря

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