我有一个jQuery代码，其中不透明度随着光标的下降而上升.我该如何反转

I have a jQuery code where opacity goes up as cursor goes down. How do I reverse it?

本文关键字：何反转 代码 jQuery 有一个 不透明度 光标      更新时间：2023-09-26

    $(function() {
        var $win = $(window),
            h = 0,
            opacity = 0,
            getWidth = function() {
                h = $win.height();
            };
    
        $win.mousemove(function(e) {
            getWidth();
            opacity = (e.pageY / h);
            console.log(opacity);
            $('#myElement').css('opacity', opacity);
        });
    });
     #myElement {
         height: 100px;
         width: 100px;
         background-color: blue;
     }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="myElement"></div>

http://jsfiddle.net/WV8jX/791/

当鼠标向下移动时，会显示该元素。我想做同样的事情，只是我希望元素在向下滚动时消失，而不是出现。有什么办法吗？

由于opacity是一个可以具有0到1之间的任何值的属性，您可以通过简单地更改以下行来反转行为：

不透明度=(e.pageY/h(；

类似于：

不透明度=1-(e.pageY/h(；

您可以在此处查看工作示例

我想这应该能奏效。

$(function(){
var $win = $(window),
h = 0,
opacity = 0,
getWidth = function() {
h = $win.height();
};
$win.mousemove(function(e) {
getWidth();
opacity = 1 - (e.pageY/h);
console.log(opacity);
$('#myElement').css('opacity',opacity);
});
});
相关文章：