0

error in tooltip, por que? necesito popers?

$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})
<meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>

<div class="container">
  <h3>Tooltip Example</h3>
  <a href="#" data-toggle="tooltip" title="Hooray!">Hover over me</a>
</div>

1
  • el error era la direccion node_modules\popper.js\dist que esta mal, lo modifique node_modules\popper.js\dist\umd y funciono!!!
    – hubman
    Commented el 24 dic. 2018 a las 16:11

2 respuestas 2

1

Es debido a que utilizas una version antigua de la librería popper.

Esta librería es la que debes utilizar:

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>

Cuando utilices librerías como por ejemplo bootstrap, tienes que revisar cuando actualicen algo, por que como en este caso pueden dejar de dar servicio para "parchear" bugs o añadir mejoras.

$(function () {
  $('[data-toggle="tooltip"]').tooltip()
})
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>

<div class="container">
  <h3>Tooltip Example</h3>
  <a href="#" data-toggle="tooltip" title="Hooray!"><b>Hover over me</b></a>
</div>

1
  • Aunque he estado mirando y el ejemplo que muestras también aparece aquí, y sinceramente me gusta más el de esa vieja versión que el de ahora.
    – sr_luis
    Commented el 20 dic. 2018 a las 5:32
1

Solo añade el siguiente script

<script>
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip(); 
});
</script>
<a href="#" data-toggle="tooltip" title="Hola, soy un tooltip">Aqui tu mensaje</a>

más la librerias de bootstrap y todo funcionara bien. Saludos

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.