显示现有PHP代码中的实际图像大小

我正在建造一座新的大楼。请不要介意我不是在本地服务器或测试服务器上工作，也不要介意我的代码。当我试图找出这个编程点的时候，它现在很混乱。通过访问我的网站，您将看到顶部的一行图像，位于jcarousel中

它可以工作，但是如果你点击下一步直到你看到“肖像”照片，就会有一个间隙。差距是因为我必须在HTML或CSS中设置一个以像素为单位的宽度，才能使旋转木马正常工作。如果设置为

auto

，旋转木马将折叠。这对我来说是有道理的，但令人沮丧的是我无法解决这个问题。我希望“横向”和“纵向”照片的高度相同，为427，但宽度要根据实际图像大小自行调整

所以我想在玩了3天之后我明白了这一点-我无法告诉你我使用了多少旋转木马代码。起初我认为这就是问题所在，有些人是。我发现，每个图像幻灯片的宽度都是在JavaScript中设置的，所以如果我给它一个640的宽度，我会得到与现在相同的结果

我的第一个问题是：

我从服务器上的一个目录调用我的图像，该目录是专门为Wordpress（）编写的。代码如下：

<?php
$uploads = wp_upload_dir();

if ($dir = opendir($uploads['basedir'].'/picture-atlantic')) {
$images = array();
while (false !== ($file = readdir($dir))) {
    if ($file != "." && $file != "..") {
        $images[] = $file; 
    }
}
closedir($dir);
}

echo '<ul>';
foreach($images as $image) {
echo '<li><img src="';
echo $uploads['baseurl'].'/picture-atlantic/'.$image;
echo '" alt="" width="auto" height="auto" /></li>';
 }
echo '</ul>';
?>

如您所见，它从picture atlantic目录调用，并将其显示在无序列表中，出于某种原因，我的jcarousel需要该列表

最后：如何使用相同的代码来获取图像，同时以实际大小显示它们？在上面的代码中，如果我定义宽度和高度，它会对所有图像执行此操作。然而，正如我之前提到的，我有使用不同尺寸的肖像画。我发现了以下代码：erikastokes.com/php/how-to-get-image-size-with-php.php，但我不确定如何在现有代码中实现它

---

有人能帮我重写吗？

您可以将图像的宽度设置为

100%

，并添加一种样式，以便在

顶部重新定位肖像图像：-50%，但如果图像处于横向，则无法看到整个图像

<?php
$uploads = wp_upload_dir();

if ($dir = opendir($uploads['basedir'].'/picture-atlantic')) {
$images = array();
while (false !== ($file = readdir($dir))) {
    if ($file != "." && $file != "..") {
        $images[] = $file; 
    }
}
closedir($dir);
}

echo '<ul>';
foreach($images as $image) {
  $myimage = $uploads['baseurl'].'/picture-atlantic/'.$image;
  $size = getimagesize($myimage);
  $top_50 = '';
  if($size[1] > $size[0]) {
    $top_50 = 'style="position: realative; top: -50%;"';
  }
  echo '<li><img src="';
  echo $uploads['baseurl'].'/picture-atlantic/'.$image;
  echo '" alt="" width="100%" height="auto" '.$top_50.'/></li>';
 }
echo '</ul>';
?>


您可以将图像的宽度设置为
100%
，并添加一种样式以在
顶部重新定位肖像图像：-50%，但如果图像处于横向，则无法看到整个图像

<?php
$uploads = wp_upload_dir();

if ($dir = opendir($uploads['basedir'].'/picture-atlantic')) {
$images = array();
while (false !== ($file = readdir($dir))) {
    if ($file != "." && $file != "..") {
        $images[] = $file; 
    }
}
closedir($dir);
}

echo '<ul>';
foreach($images as $image) {
  $myimage = $uploads['baseurl'].'/picture-atlantic/'.$image;
  $size = getimagesize($myimage);
  $top_50 = '';
  if($size[1] > $size[0]) {
    $top_50 = 'style="position: realative; top: -50%;"';
  }
  echo '<li><img src="';
  echo $uploads['baseurl'].'/picture-atlantic/'.$image;
  echo '" alt="" width="100%" height="auto" '.$top_50.'/></li>';
 }
echo '</ul>';
?>


Welp，我读到如果我已经在使用php动态显示我的图像，我就不能使用getimagesize。我最终通过Wordpress上传了一个无序列表中的图像，并将我的旋转木马标记放在post循环中。现在一切正常

哦，我读到Wordpress会自动添加图像属性，这就是在屏幕上100%显示横向和纵向照片时解决图像宽度问题的原因

对于那些试图执行类似任务的人，不要使用jj nexgen gallery插入图像。JJNexGenGallery是一个很好的插件，和其他相关插件一样。因为它没有向图像中添加属性，所以它对我试图做的事情不起作用。如果你不想这么做，我会下载他们的wordpress插件，所以我猜你们大多数人都是这样

再次感谢您的回复。
Welp，我读到如果我已经在使用php动态显示我的图像，我就不能使用getimagesize。我最终通过Wordpress上传了一个无序列表中的图像，并将我的旋转木马标记放在post循环中。现在一切正常

哦，我读到Wordpress会自动添加图像属性，这就是在屏幕上100%显示横向和纵向照片时解决图像宽度问题的原因

对于那些试图执行类似任务的人，不要使用jj nexgen gallery插入图像。JJNexGenGallery是一个很好的插件，和其他相关插件一样。因为它没有向图像中添加属性，所以它对我试图做的事情不起作用。如果你不想这么做，我会下载他们的wordpress插件，所以我猜你们大多数人都是这样

再次感谢您的回复。
您可能试图在这里一次完成太多的工作，人们可能更愿意帮助您调整，而不是承担整个问题的修复工作。首先，我要找到一个carousel库，它声称可以处理多种大小的图像，这样您就不会花时间编写可能无法正常工作的代码。“jcarousel”有这样的说法吗？如果是这样的话，看看是否有一些可以复制的演示。另外，您有11个资产文件请求在该页面上返回404，因此值得修复这些请求。顺便说一句，有一些提示：是的，本地服务器是一个好主意-如果可以的话，设置一个。如果做不到这一点，请尝试在JSFIDLE或类似工具上建立一个工作示例，这样人们就可以轻松地调整代码——更多的人将以这种方式帮助您。如果你引用了一个库（例如jcarousel），那么就可以链接到它的主页，这样人们可以根据自己的意愿获得更多关于你正在使用的内容的信息。最后，我不确定你是否需要获得这样的图像大小-我可以想象一个旋转木马将通过向左浮动图像，然后通过调整左边距滚动图像来实现。如果是这样，只要高度相同，图像宽度就不需要知道。我知道我说了很多。不过，我只问了一个问题。通过在JSFIDLE上进行设置，可以让它对用户更有帮助，这是正确的。我对这个网站比较熟悉，有点。我也会处理错误。谢谢。我试了一堆旋转木马后也有同样的想法。即使定义了宽度，它也会塌陷，每个图像都会覆盖另一个图像的一部分，就像手风琴一样。这对我来说毫无意义。我试过了，没有试过，似乎什么都不管用。你认为我有这个问题是因为我在屏幕上100%地伸展旋转木马吗？我以前用过旋转木马，从来没有过这个问题，但我被设置了