可能是Magento系统的默认功能中在生成图片缩略图时会变形,所有有社区人员写出了个图片重设而不会变形的插件,那就不用为产品的图片费心了,这个插件是:Resize images proportionally。效果看下面的图片,最直观了:
Magento Connect:magento-community/NetAmbition_DirectResize
介绍:
Give the possibility to resize images without distorted them.
You can specify a Width and a Height value as well as a ratio.
The ratio options are :
0 - none proportionnal. The image will be resized at the Width and Height values.
1 - proportionnal, based on the Width value
2 - proportionnal, based on the Height value
3 - proportionnal for the new image can fit in the Width and the Height values.
4 - proportionnal. The new image will cover an area with the Width and the Height values.
For use, replace the actuals calls :
$this->resize(150,150);
with :
$this->directResize(150,150,3);
where the options are : (width, height, ratio)
---------------------------------------------------------------
To use the module, you must find in your .phtml file the calls of the product images and change them.
For example, in the file design/frontend/default/default/template/catalog/product/list.phtml
at line 95, you can find : "->resize(x,y)" that you must replace with "->directResize(x,y,r)" with r = ratio of your choice.
相关推荐
simple-element-resize-detector, 使用隐藏的iframe观察元素大小的变化 simple-element-resize-detector 使用隐藏的iframe观察元素的大小。收费的JSFiddle演示安装npm i -S simple-element-resize-detector用法
jquery实现父元素大小改变插件:jquery-resize
在使用Vue拖拽移动时,因为我使用的Vue cdn的方式,但网上都是npm的方式写的此功能,所以我使用Vue自定义指令,不是Vue npm的方式,实现在一定范围内拖拽,移动,缩放的功能,且修复拖拽时卡顿问题
前端项目-javascript-detect-element-resize,基于事件的跨浏览器元素大小调整检测
quill.min.js image-resize.min.js
用于DOM元素变化,当元素变化时,用户需要做出什么操作
jquery的resize()事件,直接调用没有起作用引入该文件来实现resize()方法。
喜欢TypeScript的人注意:从v6.0.0开始,您可以安全地从deps列表中删除@types/react-resize-detector 。 安装 npm i react-resize-detector // OR yarn add react-resize-detector 和 import ResizeObserver from ...
前端开源库-detect-resize检测调整大小,检测通用应用程序中的元素调整大小。
jquery插件ez-bg-resize背景自适应浏览器的大小.zip
本文通过代码给大家介绍了Vue-drag-resize 拖拽缩放插件使用简单示例,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
easy-move-resize, 向OSX添加"modifier key mouse drag" 移动和调整大小 Move Resize添加简单 modifier key mouse drag 移动并调整大小到 OSX用法基于许多 X11/linux窗口管理器中发现的行为,轻松的Move ResizeCmd ...
余烬调整大小修饰符 这个插件提供了一个{{did-resize}}修饰符,每当调整给定元素的大小时便会调用回调。 调整大小检测本身由。兼容性Ember.js v3.12或更高版本Ember CLI v2.13或更高版本Node.js v10或更高版本安装...
script src =" node_modules/element-resize-detector/dist/element-resize-detector.min.js " > </ script > 这将创建一个全局函数elementResizeDetectorMaker ,该函数是使元素调整大小检测器实例的...
Vue调整大小观察器 English |安装Vue3.0 npm install --save vue-resize-observer@next Vue2.0 npm install --save vue-resize-observer 模块导入和示例导入软件包并将其安装到Vue中: const VueResizeObserver = ...
image-resize-compress是一个库,允许您在没有任何额外依赖的情况下压缩、调整大小或转换图像。 您可以使用文件、Blob 甚至 url。 查看页面。 安装 新产品经理 npm install --save image-resize-compress 纱 yarn ...
此为jquery.ba-resize.js包。用于提供一些js不支持的方法。如resize()
产品特点 轻巧,无依赖 所有道具都是React性的 支持触摸事件 使用可拖动,可调整大小或同时使用 定义棒以调整大小 为可调整大小的组件保存长宽比 限制尺寸和移动到父元素 限制拖动到垂直或水平轴 安装和基本用法 $ ...
摘要:脚本资源,jQuery,背景自适应 jquery插件ez-bg-resize,可以让网页背景图片自适应浏览器的大小,全屏显示背景效果,jquery z-bg-resize插件让你实现超炫的网页效果,你可选择一张像素比较在的图片作为背景,...