單擊Javascript中的圖像時出現問題

Question

我正在使用javascript制作圖片庫，當我單擊圖片將其放大時，而不是放大到頁面中心，而是完全從頁面中放大。 放大時如何使圖像移動到中心？ 我的畫廊應該在午夜到期，我似乎無法使它正常工作！ 我的教授暗示，當圖像放大時，我需要使圖像向上和向左移動。 如果有人可以幫忙，我將不勝感激！

Answer 1

沒有看代碼，我只能解釋概念。 您必須同時使用JS和CSS。 這是一個例子：

這是JS：

 $(document).ready(function(){
            if($(".myImage img").width() > $(".myImage").width()) {
                var url = $(".myImage img").prop("src");
                $(".myImage").css("background","url("+url+") no-repeat center center").empty();                
            }else{
                $(".myImage img").width($(".myImage").width()).height($(".myImage").height());
            }
        });

這是HTML：

<div class="myImage">
        <img src="http://cdn.walyou.com/wp-content/uploads//2010/12/facebook-profile-picture-no-pic-avatar.jpg" width="350"/>
    </div>

最后是CSS中的代碼：

.myImage { border:1px solid #000; width:300px; height:300px; overflow:hidden; }