Insérer lien bibliothèque jquery

Bonjour,
je souhaite insérer un effet sur mon site, néanmoins, celui ci ne se met pas en action. Je pense me tromper lorsque j'insère la bibliothèque jquery nécessaire au bon fonctionnement.
L effet voulu se trouve là: https://codepen.io/dghez/pen/ItxKE

moi j'insère le script: <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
est ce bien cela. Si oui, quelle erreur ai je pu commettre?
Merci de votre aide
novis

Configuration: Windows / Firefox 68.0

1 réponse

  1. Pour info, la totalité de mon code est:

    html:
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <link href="http://www.lienversmoncodecss.css" rel="stylesheet" type="text/css" /><script src="http://www.lienversmoncodejs.js"></script>
    <div class="container">
    <div class="title">MON TITRE</div>
    </div>


    css:
    @import url(https://fonts.googleapis.com/css?family=Raleway:400,,800,900);
    html {
      width: 100%;
      height: 100%;
    }
    body {
      background: -webkit-linear-gradient(#ebece7, white);
      background: linear-gradient(#ebece7, white);
      margin: 0;
      width: 100%;
      height: 100%;
      font-family: 'Raleway', sans-serif;
    }
    .container {
      position: absolute;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      left: 30%;
      top: 50%;
    }
    .title {
      font-weight: 900;
      color: transparent;
      font-size: 120px;
      background: url("http://adresse de mon image.jpg") repeat;
      background-position: 40% 50%;
      -webkit-background-clip: text;
      position: relative;
      text-align: right;
      line-height: 90px;
      letter-spacing: -8px;
    }


    js:
    $(document).ready(function(){
      var mouseX, mouseY;
      var ww = $( window ).width();
      var wh = $( window ).height();
      var traX, traY;
      $(document).mousemove(function(e){
        mouseX = e.pageX;
        mouseY = e.pageY;
        traX = ((4 * mouseX) / 570) + 40;
        traY = ((4 * mouseY) / 570) + 50;
        console.log(traX);
        $(".title").css({"background-position": traX + "%" + traY + "%"});
      });
    });


    Merci pour votre aide
    novis
    0