我的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的功能仍然没有激活。我的

我的jQuery函数不会激活

相关问题