0

人々が同様の質問を提出したことは知っていますが、私も回答を見てきましたが、うまくいく解決策は見られませんでした. jsfiddle でポートフォリオ アイテムのリストを並べ替えるスクリプトを作成しました。次のようになります。

 $(document).ready(function(){

    $( ".music-button" ).click(function() {
      $('.project-thumb-inside').not('.music').addClass('hidden').removeClass('visible');
      $('.music').addClass('visible').removeClass('hidden');
    });

 )};

jsfiddle では、スクリプトは機能しますが、サイトのフッターにプラグインすると、何もしません。誰かが理由を知っていますか？

私はすべて (スタイルシートとすべて) を jsfiddle に入れました。私のサイトは動作します: http://jsfiddle.net/LbgPF/2/

しかし、実際の Web サイトにアクセスすると、スクリプトが機能しません: http://www.rileydra.com/00_dra/work/branding-and-identity/

私はこれにかなりの時間を費やしてきましたが、それでも解決策は私が見落としている単純なものだと思います。

編集：スクリプトの抜粋を変更して、私のやり方のエラーをより適切に表示しました。

4

1 に答える 1

4

ページでnoConflictを使用しているため$、jQuery を指していません。したがって、スクリプトで を使用する代わりに、 を使用$する必要がありますjQuery。

sort.js のスクリプトを次のように変更します。

//here the shortcut version of dom ready is used, also the jQuery instance is passed as a parameter to the callback function which we assigns to a local parameter $, so we can use $ to refer jQuery inside the callback method
jQuery(function($){

    $( ".technology-button" ).click(function() {
        $('.project-thumb-inside').not('.technology').addClass('hidden').removeClass('visible');
        $('.technology').addClass('visible').removeClass('hidden');
    });

    $( ".retail-button" ).click(function() {
        $('.project-thumb-inside').not('.retail').addClass('hidden').removeClass('visible');
        $('.retail').addClass('visible').removeClass('hidden');
    });

    $( ".real-estate" ).click(function() {
        $('.project-thumb-inside').not('.real-estate').addClass('hidden').removeClass('visible');
        $('.real-estate').addClass('visible').removeClass('hidden');
    });

    $( ".publishing-button" ).click(function() {
        $('.project-thumb-inside').not('.publishing').addClass('hidden').removeClass('visible');
        $('.food').addClass('visible').removeClass('hidden');
    });

    $( ".music-button" ).click(function() {
        $('.project-thumb-inside').not('.music').addClass('hidden').removeClass('visible');
        $('.music').addClass('visible').removeClass('hidden');
    });

    $( ".churches-button" ).click(function() {
        $('.project-thumb-inside').not('.churches').addClass('hidden').removeClass('visible');
        $('.churches').addClass('visible').removeClass('hidden');
    });

    $( ".health-button" ).click(function() {
        $('.project-thumb-inside').not('.health').addClass('hidden').removeClass('visible');
        $('.health').addClass('visible').removeClass('hidden');
    });

    $( ".food-button" ).click(function() {
        $('.project-thumb-inside').not('.food').addClass('hidden').removeClass('visible');
        $('.food').addClass('visible').removeClass('hidden');
    });

    $( ".finance-button" ).click(function() {
        $('.project-thumb-inside').not('.finance').addClass('hidden').removeClass('visible');
        $('.finance').addClass('visible').removeClass('hidden');
    });

    $( ".entertainment-button" ).click(function() {
        $('.project-thumb-inside').not('.entertainment').addClass('hidden').removeClass('visible');
        $('.entertainment').addClass('visible').removeClass('hidden');
    });

    $( ".education-button" ).click(function() {
        $('.project-thumb-inside').not('.education').addClass('hidden').removeClass('visible');
        $('.education').addClass('visible').removeClass('hidden');
    });

    $( ".all-button" ).click(function() {
        $('.project-thumb-inside').addClass('visible');
        $('.project-thumb-inside').removeClass('hidden');
    });

});
于 2013-08-22T17:10:17.297 に答える