0

ポートフォリオで js onclick イベントが機能しません。ページはここで見ることができます: http://www.savantgenius.com/portfolio/brandingそしてこれはスクリプトです:

      <script type="text/javascript">
$(function() {
    var portDefault = 'bonya';
    $('#portItem').hide();
    $('#portLoader').fadeIn();
    $('#portItem').load('http://www.savantgenius.com/portfolio/portfolio-item/' + portDefault + ' #portLoadedContent', function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
    $('a.focusElement').focus();
});
function get_portfolio(portLocation) {
    $('#portItem').fadeOut();
    $('#portLoader').fadeIn();
    $('#portItem').load('http://www.savantgenius.com/portfolio/portfolio-item/' + portLocation + ' #portLoadedContent', function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
}

ローディングのアニメーションは表示されますが、画像は表示されません。どんな考えでも大歓迎です、ありがとう！

4

3 に答える 3

1

@Christian Varga のコメントから外れて、作成したリンクとしてソース セットを含む HTML を返す必要があります。次のようなものを試してください：

$("#portItem").html($("<img>")
                        .attr("src", 'http://www.savantgenius.com/portfolio/portfolio-item/' + portLocation + '#portLoadedContent'));

.load() 行の代わりに。

したがって、最終的な機能は次のようになるはずです。

function get_portfolio(portLocation) {
    $('#portItem').fadeOut();
    $('#portLoader').fadeIn();
    $("#portItem").html($("<img>")
                             .attr("src", 'http://www.savantgenius.com/portfolio/portfolio-item/' + portLocation + '#portLoadedContent'));
    // UPDATE:
    setTimeout(function () {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    }, 1000);
});

}

于 2012-06-22T04:53:21.117 に答える
0

この解決策を確認してください：

HTML:

<div id="portItem"><img /></div>

JS:

$(function() {
    var portDefault = 'bonya';
    $('#portItem').hide();
    $('#portLoader').fadeIn();
        $('#portItem img').attr("src",'http://www.savantgenius.com/portfolio/portfolio-item/' + portDefault + '#portLoadedContent');
    $('#portItem img').load(function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
});
function get_portfolio(portLocation) {
    $('#portItem').hide();
    $('#portLoader').fadeIn();
    $('#portItem img').attr("src",'http://www.savantgenius.com/portfolio/portfolio-item/' + portLocation + '#portLoadedContent');

    //check if image is loaded, then hide loader + show image:

    $('#portItem img').load(function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
}

デモを参照してください: http://jsfiddle.net/esqmr/1/

于 2012-06-22T05:17:12.030 に答える
-1

#portLoadedContent の前のスペースを削除してみてください

 <script type="text/javascript">
$(function() {
    var portDefault = 'bonya';
    $('#portItem').hide();
    $('#portLoader').fadeIn();
    $('#portItem').load('http://www.savantgenius.com/portfolio/portfolio-item/' + portDefault + '#portLoadedContent', function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
    $('a.focusElement').focus();
});
function get_portfolio(portLocation) {
    $('#portItem').fadeOut();
    $('#portLoader').fadeIn();
    $('#portItem').load('http://www.savantgenius.com/portfolio/portfolio-item/' + portLocation + '#portLoadedContent', function() {
        $('#portLoader').fadeOut();         
        $('#portItem').fadeIn();
    });
}
于 2012-06-22T04:52:29.757 に答える