如何在<img>中显示标记始终处于全尺寸标记

Question

我有一个img元素，它具有动态变化的图像。我总是希望在全方位展示这个形象。

所以，我认为，我必须动态更改img标签中的宽度和高度属性。

如何在php或javascript中执行此操作？

Answer 1

刚刚离开宽度和高度属性（和样式）应该做。如果你以后需要知道它，你可以从计算出的CSS中获取它。

Answer 2

难道你没有宽度和高度尺寸吗？据我所见，如果你没有定义宽度和高度，浏览器会显示整个全尺寸的图像。大多数现代浏览器是。

Answer 3

假设您关心alt，height和width属性（您应该），从javascript数组中读取图像属性可能非常适合您。以下是jQuery插入随机图像的示例，您可以将随机图像逻辑交换为任何类型的幻灯片等，以便进行渲染。

$(document).ready(function() { 

    var imageArray = new Array(); 
    imageArray[0] = new Array ("jungle.jpg", "http://rmportal.net", "Jungle", "400", "300"); 
    imageArray[1] = new Array ("mountain.jpg", "http://rmportal.net", "Mountain" , "350", "290"); 
    imageArray[2] = new Array ("ocean.jpg", "http://rmportal.net", "Ocean" , "442", "530"); 

    var max = imageArray.length; 
    var num = Math.floor((Math.random() * max)); 

    var hstring = "<a href='" + imageArray[num][1] + "'><img src='" + imageArray[num][0] + "' alt='" + imageArray[num][2] + "' height='" imageArray[num][3] + "' width='" + imageArray[num][4] + "' /></a>" 

    $('#my-image').html(hstring); 

}); 

Answer 4

如果您更愿意保持width和height属性在你的HTML，然后在PHP要在GD库getimagesize方法。

Answer 5

如果页面加载的图像的宽度和高度作为源中的属性包含在内， 在您第一次更改源时使用removeAttribute('width')和'height'。

如果你不希望页面“崩溃”做一个缓慢的下载过程中，预载图片并更改SRC 后img.complete是真实的，这是马上，如果它被缓存，或图像的onload火灾后。