0

WordPress テーマをダウンロードしましたが、必要に応じて変更したいと考えています。だから私の問題は次のとおりです。テーマにスライドショーがあり、次々に表示される画像をロードしています。以下にコードを投稿しましたが、私たちが興味を持っているのは、画像に場所を割り当てる部分です。画像が 1 つしかないとします。その画像がサーバーのどこかにある場合、その画像のサーバー上の場所のパスを追加すると、スライドショーに読み込むことができますhttp://myServer/path/to/the/image.jpg。私はそれを試しましたが、それは機能しています。問題は、読み込みたい画像が他の外部 URL にあるため、その行を http://myOtherServer/path/to/the/image.jpg画像に置き換えると表示されないことです。

コンソールで得たエラーは次のとおりです。

Uncaught Error: Syntax error, unrecognized expression: http://myOtherServer/path/to/the/image.jpg

これは、私の .php スクリプトの jQuery コードです。

$j(document).ready(function(){     

    $j('#kenburns_overlay').css('width', $j(window).width() + 'px');
    $j('#kenburns_overlay').css('height', $j(window).height() + 'px');
    $j('#kenburns').attr('width', $j(window).width());
    $j('#kenburns').attr('height', $j(window).height());

    $j(window).resize(function() {
        $j('#kenburns').remove();
        $j('#kenburns_overlay').remove();

        $j('body').append('<canvas id="kenburns"></canvas>');
        $j('body').append('<div id="kenburns_overlay"></div>');

        $j('#kenburns_overlay').css('width', $j(window).width() + 'px');
        $j('#kenburns_overlay').css('height', $j(window).height() + 'px');
        $j('#kenburns').attr('width', $j(window).width());
        $j('#kenburns').attr('height', $j(window).height());
        $j('#kenburns').kenburns({
            images: "http://myServer/path/to/the/image.jpg", 
            frames_per_second: 30,
            display_time: 5000,
            fade_time: 1000,
            zoom: 1.2,
            background_color:'#000000'
        });
    });
    $j('#kenburns').kenburns({
        images: "http://myServer/path/to/the/image.jpg",  
        frames_per_second: 30,
        display_time: 5000,
        fade_time: 1000,
        zoom: 1.2,
        background_color:'#000000'
    });             
});

私も追加しようとしました:

var imgS = new Image();
imgS.src = 'http://myOtherServer/path/to/the/image.jpg';

次に、パスを次のように置き換えます。

images: imgS, 

そしてそれは私にエラーを与えています:

Resource interpreted as Image but transferred with MIME type text/html: "<currentUrl>/object%20HTMLImageElement/".

ところで。私の.phpスクリプトの一番上に:

header("content-type: application/x-javascript");

したがって、一般的な質問は次のとおりです。別のサーバーに保存されている画像を jQuery コード内で取得するにはどうすればよいですか?

編集1:

kenburnsこれは、おそらく画像が要求される内部の部分です。

$.fn.kenburns = function(options) {
...

        var image_paths = options.images;
        var images = [];
        $(image_paths).each(function(i, image_path){
            images.push({path:image_path,
                         initialized:false,
                         loaded:false});
        });
...
}

編集2:

タグも作成しようとしまし<img src="http://myOtherServer/path/to/the/image.jpg"/>たが、それをオブジェクトとして渡しましたが、再びエラーが発生しました:

 Resource interpreted as Image but transferred with MIME type text/html: "<currentUrl>/object%20HTMLImageElement/".
4

1 に答える 1