Loading na página com bootstrap

Question

Olá pessoal!
   Boa tarde!
     meu problema é o seguinte, gostaria de colocar um progress bar do bootstrap na minha plicação asp.net e não consigo fazer a animação dela carregando, alguém pode me ajudar?

Answer 1

Larissa,

colocou as tags com os scripts ???? qual navegador esta utilizando para testar ???

---

Diego Almeida Barreto</strong> <br/> <em>System Analyst / Software Developer</em> <br/> <img </p> </div>

Answer 2

Larissa, 

Como você está tentando controlar o percentual? Via código ASP.Net/C# ou javascript?

---

If you found this post helpful, please "Vote as Helpful". If it actually answered your question, remember to "Mark as Answer".

Se achou este post útil, por favor clique em "Votar como útil". Se por acaso respondeu sua dúvida, lembre de "Marcar como Resposta".

Answer 3

na vdd eu não sei fazer o c# e nem o javascript para loading :/

  pode me ajudar?

Answer 4

não sei usar usar , não sei como faço o javascript para fazer o loading funcionar

   vc pode me ajudar, por favor?

Answer 5

Você precisa apenas mostrar que está processando ou precisa exibir o status real do processamento? Pois se precisar do status real, precisará utilizar recursos como SignalR ou colocar um timer no javascript (ou ASP.Net Ajax) consultando a cada segundo o status do processamento (meio paliativo).

Qual seria sua necessidade?

---

If you found this post helpful, please "Vote as Helpful". If it actually answered your question, remember to "Mark as Answer".

Se achou este post útil, por favor clique em "Votar como útil". Se por acaso respondeu sua dúvida, lembre de "Marcar como Resposta".

Answer 6

Preciso apenas exibir q está processando! coisa simples

     

Answer 7

Você precisa de um css pra animação e um código JS pra chamar ela.
no CSS:

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with    for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('http://i.stack.imgur.com/FhHRx.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with "pln" style="margin:0px;padding:0px;border:0px;color:#303336;">
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}

No javascript, você pode usar Jquery:

$body = $("body");

$(document).on({
    ajaxStart: function() { $body.addClass("loading");    },
     ajaxStop: function() { $body.removeClass("loading"); }    
});

Exemplo:

http://jsfiddle.net/VpDUG/4952/

clique no "Donec non enim"

Ok?
ABS!
-
Se a resposta for relevante ou tenha resolvido seu problema, marque como útil/resposta

Answer 8

obrigada pela ajuda, mas consegui resolver!
   grata pela atenção

Answer 9

mas tenho esse código e não consigo de jeito nenhum centralizar a imagem, você pode me ajudar?

:

css:

<style>

        .modal
        {
            ;
            top: 0;
            left: 0;
            background-color: white;
            z-index: 1000;
            opacity: 0.9;
            filter: alpha(opacity=20);
            -moz-opacity: 0.9;
            min-height: 100%;
            width: 100%;           
            height:100%;


        }

        .loading
        {
            text-align:center;
            font-family: Arial;
            font-size: 15pt;           
            width: 200px;
            height: 50px;
            display: none;
            ;
            background-color:white;
            z-index: 999;   

        }
    </style>

JavaScript:

   <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

     <script type="text/javascript">
         function ShowProgress() {

             var modal = $('<div />');
             modal.addClass(".modal");
             $('body').append(modal);
             var loading = $(".loading");
             loading.show();
             var top = Math.max($(window).height() / 2 - loading[0].offsetHeight / 2, 0);
             var left = Math.max($(window).width() / 2 - loading[0].offsetWidth / 2, 0);
             loading.css({ top: 0, left: 0, width: '100%', height: '100%', opacity: '0.7'});

         }
         $('form').live("submit", function () {
             ShowProgress();
         });
    </script>

   

Answer 10

Boa tarde Larissa IFSP,

Por gentileza, abrir uma nova thread para esse novo problema.

Atenciosamente,

---

Robson William Silva

Esse conteúdo é fornecido sem garantias de qualquer tipo, seja expressa ou implícita

MSDN Community Support

Por favor, lembre-se de Marcar como Resposta as postagens que resolveram o seu problema. Essa é uma maneira comum de reconhecer aqueles que o ajudaram e fazer com que seja mais fácil para os outros visitantes encontrarem a resolução mais tarde.