更改圖像的寬度和高度，同時窗口調整大小

我想改變圖像的寬度和高度，同時調整窗口在jquery中，我有一個示例站點，但代碼很難給我。更改圖像的寬度和高度，同時窗口調整大小

示例網站是http://xctravels.com/這裏我們可以看到窗口大小調整時圖像寬度和高度的動態變化。

2012-12-20 user1918595

可以使用window.resize事件

window.onresize = function(event) { 
//Your code 
}

實施例：

<body> 
    <script> 
     window.onresize=function(){ 
     if ($("#imageresize").width()>200 && $("#imageresize").height()>200){ 
      $("#imageresize").width($("#imageresize").width()-parseInt(10)); 
      $("#imageresize").height($("#imageresize").height()-parseInt(10)); 
     } 
     } 
    </script> 
    <img src="yourimage.jpg" width="800" height="400" id="imageresize"/> 
</body>

上面的例子只是爲了調整圖像而調整大小的窗口。

來源

2012-12-20 11:56:46 Dineshkani

調整大小的

jQuery的版本是這樣的：

$(window).resize(function() { 
    $('body').prepend('<div>' + $(window).width() + '</div>'); 
});

更多的信息在這裏：http://api.jquery.com/resize/

來源

2012-12-20 12:00:46 Jai

下面是一個例子，你如何能做到這一點：http://jsfiddle.net/uEzNj/4/

的JavaScript

var lastSize = { width: $(window).width(), height: $(window).height() }; 
$(window).resize(function (e) { 
    var win = $(window); 
    $('img').each(function (i, img) { 
     img = $(img); 
     var w = img.width(), 
      h = img.height(); 
     img.width(w + win.width() - lastSize.width); 
     img.height(w + win.height() - lastSize.height);   
    }); 
    lastSize = { width: win.width(), height: win.height() }; 
});

來源

2012-12-20 12:03:59

更改圖像的寬度和高度，同時窗口調整大小

回答

相關問題