我的jQuery函數不會激活

我試圖讓我的背景圖像隨着我的鼠標移動到#titleheader類對象上。該頁面呈現正常，但功能不會激活。我在Django工作。我從基本模板中添加了第一個（頁面頂部）#titleheader對象，該對象擴展到包含另一個#titleheader對象的主頁模板中。我已經將這兩個模板編譯爲在下面呈現頁面時Chrome會看到的內容。我懷疑有人懷疑這行中有什麼錯誤：$(this.target).css('background-position', event.pageX + 'px ' + event.pageY + 'px');但我無法弄清楚在我的代碼中要更改什麼。我的jQuery函數不會激活

我的索引頁如下：

<!doctype html> 
<html> 
    <head> 
     <style> #landing-content { 
    background-size: 110%; 
    height: 110%; 
    width: 110%; 
    overflow: hidden; 
    background-repeat: no-repeat; 
     } </style> 

     <title>Home Page</title> 
     <link rel="stylesheet" href="/static/courses/css/layout.css"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

     <script> 
      $(document).ready(function(){ 
       $(".titleheader").mousemove(function(event){ 
        $(this.target).css('background-position', event.pageX + 'px ' + event.pageY + 'px'); 
       }); 
      }); 
     </script> 
    </head> 

<body id="landing-content" background="/static/courses/images/back7.jpg"> 
    <section class="site-container slider"> 
    <article class="glass down"> 
     <div class="titleheader" style="width:100%;height:80px;position:absolute;top:0;bottom:100%;left:0;right:0;background-color:rgba(229,240,247,0.7);border-width:1px;z-index:0;border-bottom-style:solid;border-color:#f0fafb;"> 
    <a href="/" class="titleheaderimg"> 
     <img src="/static/courses/images/tz_blue2.png" alt="G" class="titleheaderimg" style="z-index:100;opacity:1;align-self:center;position:relative;top:9%;left:1%;"> 
    </a> 
     </div> 
    </article> 

<div style="height:100px;"> 
    <p> 
    </p> 
</div> 
<div class="centrediv" style="width:720px;position:absolute;top:26%;bottom:45%;left:0%;right:0;margin:auto;background-color:rgba(229,240,247,0.7);border-radius:20px;border-color:#f0fafb;border-width:1px;"> 
    <h2 style="text-align:center;vertical-align:middle;opacity:1">Hi,<span><br><br></span>We are a <span><a href="/courses/team/">XYZ based team</a></span> that works with educators to improve their efficiency using state-of-the-art language processing technology.<span></span> 
     <br><span><a href="/courses/product/">Know more.</a></span></h2> 
</div> 

<div class="centrediv" style="position:absolute;top:86%;bottom:0;left:47%;right:0;margin:auto;"> 
    <h3><a href="/courses/contact/">Contact us.</a></h3> 
</div> 

    </section> 
</body> 
</html>

UPDATE：

現在，該代碼被更新，有控制檯，pycharm，Chrome瀏覽器開發工具，或任何沒有錯誤。仍然背景不動！有人可以幫我解決這個問題嗎？謝謝！

來源

2016-08-21 Dr Confuse

我禁用了所有的擴展。我沒有得到devtools的錯誤。但是Jquery的功能仍然沒有激活。我的

相關問題