圖庫HTML圖像顯示縮略圖

首先，我想說我的壞英語對不起，我會盡我所能來幫助和幫助你。圖庫HTML圖像顯示縮略圖

那麼我有一個項目，我的網頁設計師班，我的老師希望我做一個畫廊的HTML頁面，但我找不到任何答案或任何接近我正在尋找。

嗯，我會解釋他是怎麼想......

讓我們想象畫廊頁3張縮略圖照片。然後第一個縮略圖是飛機，第二個是小船，第三個是汽車。

現在，如果我點擊飛機縮略圖，它應該只顯示飛機的幻燈片，如果我點擊汽車縮略圖，它應該只在幻燈片中顯示汽車圖像...有沒有人明白我的意思？如果不是，我會更好地解釋它。非常感謝，再次抱歉，因爲我的英語和解釋不好。

這是我目前從現在開始，但是當我點擊第一個圖像上它打開了一個我點擊，當我點擊旁邊去下一個在它的側面 enter image description here

來源

2014-03-29 Patrick Sterza

你能告訴我們你已經試過了嗎？ –

@MaxLangerak我編輯我的文章，請看看它...對不起英語 –

你指到旋轉木馬？當你點擊一個縮略圖時，你是否想要出現一個彈出窗口並具有轉盤特性？從一張照片導航到另一張照片。

如果可能的話你可以在jsfiddle.net上顯示你的代碼嗎？

來源

2014-03-29 12:31:52 user3223207

不，我想點擊飛機圖像，它會打開一個彈出式畫廊，只會顯示飛機圖像，即使有一個一輛汽車或一條船的縮略圖thumbnail這就是我的意思 –

假設幻燈片功能看起來有點像這樣：

function slideShow() { 
    var slideShowImages = new Array(); 

    slideShow.prototype.load = function(img){ /*loads img into array*/ }; 
    slideShow.prototype.start = function(){ /*starts the slideshow*/ }; 
    slideShow.prototype.stop = function() { /*stops slideshow*/ }; 
    slideShow.prototype.empty = function() { /*empties array*/ }; 
};

爲了確保您只顯示某一車輛的圖像將它們放置在一個數組：

var airplanes = new Array(); 
var cars = new Array(); 
var boats = new Array();

然後，當裝載所有圖像，將它們放在正確的陣列中：

var boatImg = new Image(); 
boatImg.src = theSourceOfImage; 
boatImg.addEventListener('load', function() { boats.push(boatImg) }); 
//etc etc.

將點擊處理程序附加到拇指指甲。

SlideShow = new slideShow(); 

$("#boatThumbNailId").click(function() { 
    //now place all of the pictures from the boat array in the slideshow 
    for(var i = 0; i < boats.length; i++) 
     SlideShow.load(boats[i]); 
    //then just start the slideShow 
    SlideShow.start(); 
});

我希望這會對你有所幫助，祝你好運。

來源

2014-03-29 12:34:57

是的是這是類似的東西，但我從來沒有見過這個，你能幫我在我的項目？你有電子郵件，臉譜，Skype或什麼，所以我們可以聯繫？ –

給我發電子郵件，我會看看我能做什麼，我的電子郵件在我的頁面上。 –

我在您的頁面上找不到您的電子郵件對不起 –

圖庫HTML圖像顯示縮略圖

回答

相關問題