0

私はワードプレスで次の例を使用しようとしています - 広告を保持する div が必要です。たとえば、ページを 300 ピクセル下にスクロールし、ページが一番上に達するまでスクロールアップし、ユーザーがスクロールし続けるとそこにとどまります。下。例はこれを説明する必要があります:

http://jsfiddle.net/jPxEY/

ここでは、動作するはずの html ファイルにあり、すべてがそこにあるように見えますが、動作しません: http://www.altesc.net/exmp.html

実際、「類似の質問」ボックスを見て下にスクロールすると、まさに私が求めているものです。

すべてを正しく行ったと確信していますが、javascript が機能していないようです。jquery からすべてをコピーし、別の js ファイルではなく、ヘッダーに直接追加するだけで機能します。次のように jquery を呼び出す場合のみです。

<script src="http://code.jquery.com/jquery-1.7.1.js" type="text/javascript">

キックインに失敗します。

何が間違っているかについてのアイデアはありますか?

役立つヘッダーを追加しました:

<script type='text/javascript' src='http://www.altesc.net/wp-includes/js/jquery/jquery.js?ver=1.8.3'></script>

<script type="text/javascript">
//<![CDATA[
$(window).load(function(){

$(document).scroll(function() {

var useFixedSidebar = $(document).scrollTop() > 330;
$('.adscrollleft').toggleClass('fixedSidebar', useFixedSidebar);

});

});//]]> 
</script>
4

4 に答える 4

1

これを削除します:$(window).load(function(){

于 2012-12-29T04:21:43.183 に答える
1

質問の下のコメントで述べたように、jQuery インクルード ファイルの一番下に への呼び出しがあり、 への短縮関数参照をjQuery.noConflict();解放します。$jQuery()

したがって、これを解決する最も簡単な方法は次のとおりです。

jQuery(window).load(function(){
    jQuery(document).scroll(function() {
        var useFixedSidebar = jQuery(document).scrollTop() > 330;
        jQuery('.adscrollleft').toggleClass('fixedSidebar', useFixedSidebar);
    });
});

これで、コードが機能します。これは、私のコンピューターで動作するファイルの Pastebin です (画面が非常に大きい場合は、ブラウザーを最大化しないでください)。

http://pastebin.com/GCvaCF7c

ただし、短縮形が本当に好きな人もいる$ので、これをよく見かけます。

//                   >>> The $ below <<<
jQuery(window).load(function($){
    $(document).scroll(function() {
        var useFixedSidebar = $(document).scrollTop() > 330;
        $('.adscrollleft').toggleClass('fixedSidebar', useFixedSidebar);
    });
});

jQuery では、スコープ内で使用できます。jQUery()グローバルスコープにいるときはいつでも使用することに慣れてください。

于 2012-12-29T04:21:50.023 に答える
0

ここでいくつかの問題:

  • まず、jQueryのローカルコピーを使用します。

    オンラインコピーは常にアップし続けますが、自分のものを持っているのが最善です。別の見方をすると、jQueryサイトがダウンした場合はどうなりますか?「リーチング」しているスクリプトもダウンし、リーチされたjQueryに依存するスクリプトが失敗します。

  • 最初にライブラリをロードします

    deferスクリプトは順番にロードおよび解析されます(属性やasync依存関係ローダーなどの非同期のものが使用された場合を除く)。スニペットがjQueryに依存していて、jQueryのに読み込まれた場合、失敗します。最初にライブラリスクリプトをロードし、次にそれに依存するスクリプトをロードします。

    私が言っていることの簡単なビジュアル:

    <script src="jQuery.js"></script>
    <script src="yourScriptThatDependsOnJQuery.js"></script>
    <script>
        //scripts that depend on jQuery
    </script>
    
于 2012-12-29T03:41:58.530 に答える
0

これを機能させるために試すことができることがいくつかあります。

  1. スクリプトがページに取り込まれていることを確認してください。確認する方法の 1 つは、Chrome デバッガーの [ソース] タブを使用し、html ヘッド セクションで他のファイルを検索することです。

  2. jQuery をインクルードした後に依存スクリプトをインクルードしたことを確認してください。

  3. jQuery が正しく含まれているかどうかを確認し、1 回だけ実行します。

  4. jQuery の競合に注意してください。$ をオーバーライドしている他のライブラリがあるため、$ は jQuery のエイリアスではないため、コードが機能しません。同じjQuery.noConflict()変数 $.

于 2012-12-29T03:53:28.393 に答える