在窗口調整大小時對多個Div進行動畫處理

Question

因此，我正在一個個人網站上工作，並且在定位方面遇到了一些問題。

http://i.imgur.com/tFvvnFN.png

理想情況下，這就是我想要的網站外觀。 但是，現在無論何時調整窗口大小，從主中心圖像彈出的按鈕都不會停留在該窗口上。 我要解決此問題的想法是將所有內容設置在應位於1,000px窗口處的位置，然后具有一個在加載時觸發的函數，並在每次調整大小時將按鈕（“調整大小”-1000）像素向左移動。

如果有人可以幫助使其正常工作，或指出該代碼在哪里出問題，我將非常感激。

相關HTML；

<div class = "mobile">
    <div id= "titlehead">
        <img src = "./images/Tilehead.png" alt="headtitle">
    </div>
    <div id= "illustrationb">
        <a href = "Illustrations.html">
            <img src = "./images/IllustrationBanner.png" 
            onmouseover="this.src='./images/Bannerc-1.png'" 
            onmouseout="this.src='./images/IllustrationBanner.png'"></a>
    </div>
    <div id= "aboutb">
        <a href = "Illustrations.html">
            <img src = "./images/Banner-4.png" 
            onmouseover="this.src='./images/Bannerc-4.png'" 
            onmouseout="this.src='./images/Banner-4.png'"></a>
    </div>
    <div id= "photob">
        <a href = "Illustrations.html">
            <img src = "./images/Banner-3.png" 
            onmouseover="this.src='./images/Bannerc-2.png'" 
            onmouseout="this.src='./images/Banner-3.png'"></a>
    </div>
    <div id= "infob">
        <a href = "Illustrations.html">
            <img src = "./images/Banner-2.png" 
            onmouseover="this.src='./images/Bannerc-3.png'" 
            onmouseout="this.src='./images/Banner-2.png'"></a>
    </div>
</div>

jQuery;

$(document).ready(function){
    var $xMove = window.width - 1000
    var $mobile = $('.mobile')
    if(window.width > 1000){
        $($mobile).animate({
            left: "+=" + $xMove
        })
    }
}
$(window).resize(function){
    var $xMove = window.width - 1000
    var $mobile = $('.mobile')

    if(window.width > 1000){
        $($mobile).animate({
            left: "+=" + $xMove 
        })
    }
}

Answer 1

$(document).ready(function(){
    $(window).on('resize', function(){
        var windowsize = $(window).width();
          if (windowsize > 1000)
          {
              //do this
              //do that..
          }
          else
          {
              //do this
              //do that..
          }
    });
});

Answer 2

圖片是靜態尺寸嗎？ 如果是這樣，請將其包裝在div中，將位置設置為相對，並絕對定位按鈕。

如果您創建JS小提琴，我將通過示例向您展示。