0

Web ページに一連の画像サムネイル (200 ピクセル) を表示するフォト アルバムを実装しましたが、ユーザーがサムネイルをクリックして写真をフルサイズで表示できるようにしたいと考えています。サムネイル インデックスを非表示にすることで、フルサイズ ビューを同じページに表示する必要があります。そのため、ユーザーがフル サイズの画像を閉じると、サムネイル インデックスが再び表示されます。JSON ファイルからすべての画像を読み取り、それらを div#images に追加し、img {height:200px, width:200px} で CSS を適用する次のコードがあります。

var imageList;
$.getJSON('images.json', function(data) {
    imageList = data;
    for (var i = 0; i < imageList.length; i++) {
        $('<img>').attr({src: imageList[i].img_src, 
                    title: imageList[i].title}).appendTo('#images');    
    }
});

私はjQueryが初めてで、上記のタスクを実行したいので、その方法についての回答をいただければ幸いです。前もって感謝します。

4

2 に答える 2

2

これを試してください:

Replace <img> as img.

これを変える、

$('<img>').attr({src: imageList[i].img_src, 
                    title: imageList[i].title}).appendTo('#images'); 

これを使って、

$('img').attr({src: imageList[i].img_src, 
                title: imageList[i].title}).appendTo('#images'); 
于 2012-10-16T21:05:55.173 に答える
1

私がここで行っていることを見て、必要に応じてリバース エンジニアリングしてください: http://oregonadventuretours.com/

より多くのコンテンツを含む div を表示および非表示にする方法に注意してください。あなたの場合、それはより大きな写真になります。

于 2012-10-16T20:52:18.140 に答える