2

Estou usando esse plugin para mostrar mensagens , mas não estou conseguindo fazer isso.

 <!DOCTYPE html>
    <html>

    <head>
        <meta charset="utf-8" />
        <title>toastr examples</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

        <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css">

            <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js">
            </script>
            <script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.0.2/js/toastr.min.js"></script>
        </head>

        <body class="container">
            <h1>yes</h1>
            <script>

                toastr.info('Are you the 6 fingered man?', "Hey", { timeOut: 4000, progressBar: true });
                console.log(toastr);
            </script>
        </body>

        </html>

Eu tentei assim, mas não funcionou:

 toastr.info('Are you the 6 fingered man?', "Hey", { timeOut: 4000, progressBar: true });

Mas assim apenas para o timeOut funciona perfeitamente.

 toastr.info('Are you the 6 fingered man?', "Hey", { timeOut: 4000 });

Onde eu posso encontrar um tutorial sobre isso? Onde eu arrei no código acima?

1 Resposta 1

1

Não sei exatamente o motivo, mas acredito que a referência do CDN está desatualiza, além disso estou usando a versão 3.x e não 2.x do jQuery e funcionou...

inserir a descrição da imagem aqui

Teste o código abaixo para ver funcionando

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Page Title</title>
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">

</head>
<body>

	<p>YES</p>
	
	<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>

	<script>
	toastr.success('We do have the Kapua suite available.', 'Turtle Bay Resort', {
          "timeOut": 4000, 
          "progressBar": true
        })
	</script>

</body>
</html>

2
  • 1
    Copiei e colei o seu código e usei a versão 1 e 2 do jquery e também deu certo. 7/06/2019 às 20:54
  • 1
    @PenaPintada então eh problema com o CDN mesmo, o link que pequei foi direto do exemplo deles, e não o que estava na documentação rss. Tem a ordem de indexação tbm... Eu botei os .js no final do documento, não sei se nesse caso tem a ver
    – hugocsl
    7/06/2019 às 21:56

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .