移動的亮點工作在一個頁面上而不是其他

Question

我使用這個移動的亮點是在我的網站參考：https://css-tricks.com/examples/MovingHighlight/

<script> 
var originalBG = '', 
    lightColor = 'fff', 
    gradientSize = 500; 

$('.navigation .flex, .navigation a, .black') 
.mousemove(function(e) { 
    originalBG = $(".navigation .flex, .black").css("background-color"); 
    x = e.pageX - this.offsetLeft; 
    y = e.pageY - this.offsetTop; 
    xy = x + " " + y; 

    bgWebKit = "-webkit-gradient(radial, " + xy + ", 0, " + xy + ", 400, from(rgba(255,255,255,0.2)), to(rgba(255,255,255,0.0))), " + originalBG; 
    bgMoz = "-moz-radial-gradient(" + x + "px " + y + "px 45deg, circle, " + lightColor + " 0%, " + originalBG + " " + gradientSize + "px)"; 

    $(this) 
     .css({ background: bgWebKit }) 
     .css({ background: bgMoz }); 

}).mouseleave(function() { 
     $(this).css({ background: originalBG }); 
}); 
</script> 

我試圖消除各種腳本等，但似乎沒有奏效。任何想法，爲什麼我沒有看到主頁上的漸變？

Answer 1

刪除父元素position:relative;解決了這個問題。