浮動內嵌右上角

我想知道如何讓圖像在點擊時保持在右上角，但讓其他元素流動嗎？浮動內嵌右上角

img.selected{ 
    height: 600px; 
    width: auto; 
    -webkit-filter: none; 
    float: right; 
    top: 0; 
}

http://jsfiddle.net/vL9RN/3/

當你點擊接近列表右側的圖像，他們漂浮正確的，但不要停留在頁面的頂部，但在其他的圖像，而不是流動。有沒有辦法用CSS做到這一點？

來源

2013-06-24 Eric Wolf

+1因爲小貓 – hjpotter92

那麼，你總是希望選定的圖像在頂部和所有的縮略圖在下面？ – jackweinbender

這裏是一個偏袒的工作解決方案：http://jsfiddle.net/vuvz8/ – Gimmy

試試這個：

img.selected{ 
    height: 600px; 
    width: auto; 
    -webkit-filter: none; 
    position: absolute; 
    right: 0; 
    top: 0; 
}

來源

2013-06-24 02:24:46

不起作用，縮略圖最終疊加在圖像上。我想避免這種情況。 –

我認爲這能解決你的問題。檢查了這一點:) http://jsfiddle.net/vL9RN/4/

對不起，我使用的JQuery但由於我不是那個熟悉的JavaScript，而無需使用jQuery的

$(function(){ 
    $('img').eq(0).addClass('selected'); 

    $('img').not('selected').click(function(){ 
     $('img.selected').insertBefore($('img').eq($(this).index())).removeClass('selected'); 
     $(this).insertBefore($('img').eq(0)).addClass('selected'); 
    }); 
});

來源

2013-06-24 04:59:56

這不適用於我的設置，我使用ajax從php腳本獲取圖像列表，並且無法使用「onclick」運行腳本來運行。我知道有辦法解決這個問題，但他們超出了我的理解。這個腳本是否可以作爲一個onclick函數來運行？ –

只是一個float: left;添加到您的img CSS。

Test Link

另一種方法是，

在一個<div>所有的縮略圖，並有「選擇」 IMG在另一<div>單獨<img />。然後，您需要做的所有onClick是更改「選定」img的src屬性。

來源

2013-06-24 05:09:47

浮動內嵌右上角

回答

相關問題