Question

关于我使用ckEditor作为BBCode编辑器的使命我直接面对我的网站问题。

我有用户提交的内容，可以包含[img]标记。

我真的希望图片的宽度为100％，这很好。我将任何[img]标签转换为html并应用一个按照我的意愿设置的类。

function basicbbcode($text) {
$text = str_replace("[IMG]", "<img class='buildimage' src='", "$text");
$text = str_replace("[/IMG]", "'>", "$text");
$text = str_replace("[img]", "<img class='buildimage' src='", "$text");
$text = str_replace("[/img]", "'>", "$text");
}

问题在于有人使用小/低分辨率图像。我不希望拉伸那张图片，因为它看起来很糟糕。

我的目标是找到一个阈值，所以如果图像宽度超过800px，请给它一个buildimage类。如果它更小，给它一类buildimage-small。

然后我会保持该图像的自然大小。我正在努力推广用户提供高质量的图像，但同时希望保持网站看起来很棒，没有拉伸图像，因为res很小。

那么，有没有办法在它作为$ text变量从数据库中出来时检查图像大小，然后相应地采取行动。理想情况下使用php，但也许是jquery？

不知道这个可能吗？

Answer 1

您可以使用getimagesize()：

getimagesize（）函数将确定任何给定图像的大小文件并返回尺寸以及文件类型和a 要在普通HTML IMG标记内使用的高度/宽度文本字符串对应的HTTP内容类型。

<?php
    list($width, $height, $type, $attr) = getimagesize("img/flag.jpg");
?>

来源：http://us3.php.net/getimagesize

Answer 2

要在jQuery中执行它可能就像：

 var box = $("#boxWithImageInside"),
     img = box.find("img.buildimage");
 if (img.width() > box.width()) {
     img.width("100%");
     img.height("auto");
 }

代码未经过测试，因此您可能需要根据需要进行调整。

Answer 3

如果您想在客户端解决问题，可能会有所帮助：FIDDLE

$(function () {
    isImgLargerThan800px = function (src) {

        var img = new Image();

        img.onload = function () {
            if (this.width < 800) {
                alert('this image need SMALL class')
            } else {
                alert('this image need LARGE class')
            }
        };

        img.src = src;
    };

//TEST
    $('a').on('click', function () {

        isImgLargerThan800px($(this).text());
        alert('Now checking for image size of URL : ' + $(this).text())

    })

});

转换BBCode文本时检查图像大小

3 个答案: