BigSale模板： 相册上传 竖长方形图片 不自动缩小的问题

2016-07-07 16:07 来源：www.chinab4c.com 作者：ecshop专家



截图1，横着的图片
00000.jpg

截图2，竖着的图片
1111.jpg
原图片：1；
未标题-2.jpg
2；
未标题-1.jpg


我用的是BigSale模板，商品详情页面的大图，要是上传正方形的图片和横着的长方形图片，它就可以自动缩小在300*300的框内，反而上传竖着的长方形图片，他就不能自动缩小在框内了，会自动显示图片的上半部分。要怎么修改呢？

是商品相册里的图片，点击下面的小图在大图显示的时候，竖着的长方形图片不能自动缩小在宽内，而只显示上半部分。谢谢了，希望能得到解决。


这是CSS代码：

  1. .goodImg .imgInfo{
  2. border:1px solid #ccc;
  3. height:300px;
  4. width:300px;
  5. line-height:300px;
  6. text-align:center;
  7. margin:0px;
  8. overflow:hidden;
  9. }
  10. .goodImg .imgInfo img{
  11. *margin-top: expression(( 300 - this.height ) / 2);
  12. text-align:center;
  13. vertical-align:middle;
  14. overflow:hidden;
  15. }
复制代码


下边是详情页面的图片代码:


  3. <div class="imgInfo">
  4. <img src="{$goods.goods_img}" alt="{$goods.goods_name|escape:html}" id="goodsimg" style="width:300px; cursor:pointer;" onclick="window.open('gallery.php?id={$goods.goods_id}'); return false;"/>
  5. </div>
复制代码

回答：
。。。
我也是使用BigSale模板。。关注一下。。

顶一下，管理员帮忙看看吧

帮你顶一下~

自己再顶一下，版主、管理员来看看吧。非常感谢

自己再顶一下，版主、管理员来看看吧。非常感谢

贴下网址看下

style="width:300px; cursor:pointer;"
这里加高的样式试下





这样加不知道可以不可以？ 加上还是不行，这样连横长方图片也变形了。
<div class="imgInfo">
<img src="{$goods.goods_img}" alt="{$goods.goods_name|escape:html}" id="goodsimg" style="width:300px;height:300px; cursor:pointer;" onclick="window.open('gallery.php?id={$goods.goods_id}'); return false;"/>
</div>

上边就是商品详情页面的代码。帮忙看下吧。谢谢了

因为是在本地做的测试。还没有演示地址。

自己再顶一下，版主、管理员来看看吧。非常感谢

给你个正方形的框，你硬要塞个长方形图片干嘛，这个你还是改图吧。又方便又快



谢谢了，我的产品大概有5000多个，图片上万张，基本上都是横、竖长方形的图片，这要是每一张图片都改成正方形。不太好吧。

不过还是谢谢你的跟帖。

自己再顶一下，版主、管理员来看看吧。非常感谢

帮你顶住 快去叫高手来

直接用一断JS代码控制宽超过300自动缩放成300宽高度按比例变化，网上有很多类似的代码