-6

这可能是有史以来最厚的问题！但是我怎样才能让它在我的 html 上工作呢？

HTML

<div class="test2"></div>

<div class="test"></div>

<div class="test3"></div>

CSS

.test2 {margin-top: 250px;
       position:absolute;
       left: -100px;
       width:100px;
       height:100px;
       background: aqua;
}

.test {margin-top: 500px;
       position:absolute;
       right: -100px;
       width:100px;
       height:100px;
       background: aqua;
}

.test3 {margin-top: 1000px;
       position:absolute;
       right: 100px;
       width:100px;
       height:100px;
       background: aqua;
} ​​

JS

var $test2 = $(".test2");
$(window).scroll(function() {
    if ($(this).scrollTop() > 20) {
        $test2.stop().animate({
            left: "200px"
        }, 200);
    }
});    

var $test = $(".test");
$(window).scroll(function() {
    if ($(this).scrollTop() > 100) {
        $test.stop().animate({
            right: "200px"
        }, 400);
    }
});​

http://jsfiddle.net/maxmitch/UgEu6/（完整示例）

4

2 回答 2

1

获得 jsFiddle 的单页工作版本的一种简单方法是使用他们的“共享全屏结果”链接，例如 jsfiddle.net/maxmitch/UgEu6/embedded/result/。

然后您需要做的就是右键单击主框架并复制源代码。请注意，如果您使用 jsFiddle 的“规范化 css”选项，则必须调整您看到的 CSS 文件的路径。

于 2012-11-16T18:20:53.410 回答
0

“在你的 html 上？” 我......它在“你的html”上不起作用。你有3个文件。一个 javascript 文件、一个 CSS 文件和您的 HTML 文件。

在左边，你会看到它在onDomReady事件中使用了 jQuery 1.7.2 库，如果我记得是

$(document).ready(function(){
    // code to execute
})

您需要为每个文件创建 3 个单独的文件。您需要知道如何将 CSS 和 Javascript 文件放入您的 HTML 文档中。如果您不知道，请谷歌它。

于 2012-11-16T18:18:34.467 回答