Question

我有一个来自客户的非常奇怪的请求：

基本上我有一篇博文，在帖子开头有一个“元数据”框浮动到右边。所以在帖子的开头，内容的宽度是300px，在框结束后，宽度是500px。所以内容包裹/流过该盒子，就像L形一样。

客户希望如果图像插入到帖子中，如果它在框下方，则为100％宽度（500px），如果它在框的旁边，则应为300px宽。自动。他们不想自己调整图像大小。

我不能在后端（PHP）中执行此操作，是否可以在CSS / JS中执行此操作？这里棘手的部分是我不知道图像在内容中的位置 - 它可以是内容中的第一个元素，它可以在中间，最后，在... ...

Answer 1

不确定我是否理解上下文，但这可能会让你朝着正确的方向前进......

var offsetOfBottomOfBox = 700; //you would figure this out a different way

$("#contentDiv img").each(function(idx,el){
    //get image position in document
    var y = $(this).offset().top;

    if(y < offsetOfBottomOfBox) {
        $(this).css("width","300px");
    }
});

注意：我还没有测试过这段代码......

根据内容中的位置调整图像大小

1 个答案: