JQuery的設置兩個IMGS以相同的位置，另一

我一直在特林同一位置設置img作爲另一個使用jQuery .position()和.css()JQuery的設置兩個IMGS以相同的位置，另一

這裏是代碼：

function setImgsToSamePosition() { 
    var position = $('#img1').position(); 
    $('#img2').css({ 'left': position.left + 'px', 'top': position.top + 'px' }); 
    $('#img3').css({ 'left': position.left + 'px', 'top': position.top + 'px' }); 
} 

$(document).ready(function() { 
    // Set imgs pos to be equal to img1 pos 
    setImgsToSamePosition(); 
})

有什麼想法？

來源

2017-04-07 GreetingsFriend

刪除'$''之前function'。 'function'是一個關鍵字。 –

我確實刪除了。還是行不通... – GreetingsFriend

你可以用這種方式重疊圖像。我將位置設置爲fixed，然後爲其他圖像設置左側和頂部值。我不完全確定你爲什麼要這樣;所以，如果這不是理想的結果，只是評論。

function setImgsToSamePosition() { 
 
    var position = $('#img1').position(); 
 
    $('#img2, #img3').css({ 'left': position.left + 'px', 'top': position.top + 'px' }); 
 
} 
 

 
$(document).ready(function() { 
 
    // Set imgs pos to be equal to img1 pos 
 
    setImgsToSamePosition(); 
 
})

img { 
 
    width:100px; 
 
    height:100px; 
 
    border:1px solid black; 
 
} 
 

 
#img1, #img2, #img3 { 
 
    position:fixed; 
 
} 
 

 
#img1 { 
 
    left:50px; 
 
    top:50px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<img id="img1" src="http://neil.computer/stack/bg.jpg" /> 
 
<img id="img2" src="http://neil.computer/stack/bg2.jpg" /> 
 
<img id="img3" src="http://neil.computer/stack/bg3.jpg" />

來源

2017-04-07 03:32:12 Neil

對於一個元素在此方式工作 位置的平移：相對; left：20px;

來源

2017-04-07 03:34:47 Godie007

我不知道你到底是什麼，但我只是糾正了你的代碼。

$(function(){ 
 
    var position = $('#img1').position(); 
 
    var x = $("#img2").position(); 
 
    $("#pos").text("top: "+x.top+" "+"left: "+x.left); 
 
    $('#img3').css({ 'left': x.left + 'px', 'top': x.top + 'px' }); 
 
});

<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
<img src="https://www.w3schools.com/css/img_fjords.jpg" id="img1" style="height:100px;width:100px;"/> 
 
<img src="https://www.w3schools.com/howto/img_mountains.jpg" id="img2" style="height:100px;width:100px;"/> 
 
<p id="pos"></p> 
 
</body> 
 
</html>

來源

2017-04-07 03:42:29

JQuery的設置兩個IMGS以相同的位置，另一

回答

相關問題