1

我正在尝试构建一个对 CSS 对象(.thumbposition1 -> 20)进行不透明度淡化的函数。我正在动态地为背景图像分配与其灰度对应物相同的 CSS 属性,该属性被鼠标悬停(在滚动条上)。

当我通过名称手动指定每个类时,这很有效,但是当我尝试通过引入 .each 调用来最小化事情时,会发生不好的事情: .hover 工作正常并返回被鼠标悬停的 CSS 类,但是当我去更改时(并测试)覆盖和底层图像的 CSS 属性,偏移值始终相同(顶部:0px,左侧:200px)。

我究竟做错了什么?请原谅任何愚蠢的错误/可怕的代码/等。我是菜鸟。

$(document).ready(function () {
$("img").each(function(i) {
    var i = i + 1;
    var iString = i.toString();
    var currentThumbPositionString_gs = ".thumbpositiongs" + iString;
    var currentThumbPositionString_c = ".thumbposition" + iString;
    var currentThumb_gs = $(currentThumbPositionString_gs);
    var currentThumb_c = $(currentThumbPositionString_c);
    var thumbPos = currentThumb_gs.offset();
    var thumbPos_c = currentThumb_c.offset();
    currentThumb_gs.hover(function() {  
            currentThumb_c.css({
                    left:thumbPos.left,
                    top:thumbPos.top,
                    height:"auto",
                    width:"auto",
                    "z-index":"-1000000",
                    visibility:"visible"});
            currentThumb_gs.stop().animate({"opacity": "0"}, "1500");
            },
            function() {
                    currentThumb_gs.stop().animate({"opacity": "1"}, "1500");
                    currentThumb_c.delay(355).queue( function() {
                    $(currentThumb_c).css({
                    height:"0",
                    width:"0",
                    visibility:"hidden"});
                currentThumb_c.clearQueue();
                });
            });
        });
    });
4

0 回答 0