- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
这是我第一次尝试的方法:
$('#thumbnail').imgAreaSelect({
x1: 5,
y1: 5,
x2: $('#thumbnail').width(),
y2: $('#thumbnail').width()*0.66,
aspectRatio: '1:0.66'
});
但是一些裁剪后的图像不会溢出......
这似乎对我尝试过的大多数图像分辨率进行了预选...
var thwidth = $('#thumbnail').width();
var thheight = $('#thumbnail').height();
aspectRatio = 0.66;
$('#thumbnail').imgAreaSelect({
x1: 5,
y1: 5,
x2: thwidth - 80,
y2: (thwidth - 80) * aspectRatio,
aspectRatio: '1:0.66'
});
但它不会选择可能的最大值;而且它对我来说看起来有点脏......
如何选择尊重宽高比的最大(居中,如果可能)宽度/高度坐标? (在本例中:1:0.66)
最佳答案
试试这个代码
var selWidth = 500;
var photo = $('#photo'),
photoWidth = parseInt($('#photo').width()),
maxWidth = Math.min(selWidth, photoWidth)
aspectRatio = 0.66,
maxHeight = maxWidth * aspectRatio,
yTop = parseInt(photo.height()) / 2 - maxHeight / 2;
$('img#photo').imgAreaSelect({
x1: photoWidth / 2 - maxWidth / 2,
y1: yTop,
x2: (photoWidth / 2 - maxWidth / 2) + maxWidth,
y2: yTop + maxHeight
});
jsfiddle此代码创建一个居中选择区域,具有给定的宽高比和最大宽度。如果最大宽度超过图像的宽度,则使用图像的宽度作为最大宽度。请注意,它适用于 jquery 1.8.3,我认为这是因为 imageareaselect 插件与最新的 jquery 版本不兼容(但我不确定)。
<小时/>我改进了代码,以包含 height overflwo 和 aspectRatio > 1 的情况。我希望这在所有条件下都有效:)
var selWidth = 350;
var photo = $('#photo'),
photoWidth = parseInt($('#photo').width()),
photoHeight = parseInt($('#photo').height()),
maxWidth = Math.min(selWidth, photoWidth),
aspectRatio = 0.66,
maxHeight = maxWidth * aspectRatio;
if (maxHeight > photoHeight) {
maxHeight = photoHeight;
maxWidth = maxHeight * ( 1 / aspectRatio);
}
var yTop = photoHeight / 2 - maxHeight / 2;
$('img#photo').imgAreaSelect({
x1: photoWidth / 2 - maxWidth / 2,
y1: yTop,
x2: (photoWidth / 2 - maxWidth / 2) + maxWidth,
y2: yTop + maxHeight
});
关于javascript - 图像区域选择 : preselect biggest thumbnail possible respecting aspectRatio,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15990847/
所以我已经为 Collatz 序列编写了代码,但我希望能够识别并打印出序列中出现的最大数字。这是我的代码: import java.util.Scanner; public class Colla
我正在做一项学校作业,其中的任务是按升序对数组进行排序。我在冒泡排序上遇到了麻烦。当数组开始排序时,它确实排序了,但数组的最大整数正在切换为随机整数。 不要介意选择变量和输入。该任务应该可以选择是要升
给定: var array = [1,2,5,10]; var limit = 8; 我正在寻找一种方法来找到数组中小于极限 8 的最大元素。类似于: Math.max(array, "while <
Java 标准库中哪些方法的参数数量最多? 注意:变量参数 (Varargs) 应计为数组类型的 1 个参数,而不是无限数量的参数。 原因:我正在尝试设计更好的库,并且我正在考虑禁止使用超过 4 个参
user = SkillUser.find_all_by_skill_id(skill_id) user.size 给我: 1 2 2 1 3 1 3 1 3 2 1 1 3 如何从这行数字中获得最大
这是我第一次尝试的方法: $('#thumbnail').imgAreaSelect({ x1: 5, y1: 5, x2: $('#thumbnail').width(),
我有一个包含日期和值的 DataFrame(在下面的代码中,我可能没有正确解析日期)。 import pandas as pd d = {'date': pd.Series(['2010-01-01'
Arrange given numbers to form the biggest number给出算法。它用下面的文字来证明算法的正确性: So how do we go about it? The
我的程序存在内存泄漏问题。我正在使用 muppy从 pympler 库打印我的程序中最大的 PyObjects 的列表,按字节大小排序。这是一个如何使用它的可重现示例: $pip install py
我有以下 3 个表: CREATE TABLE IF NOT EXISTS `item` ( `id` int(11) NOT NULL auto_increment, `subcategory`
假设我们使用的是 python:如果给出一个整数 a 和一个整数列表。我们应该找到这个数字:它应该小于a;它是所有小于a的数字中最大的一个; 例如。 a=3, list=[1,2,3,4],这个数字应
这个问题不太可能帮助任何 future 的访问者;它只与一个小的地理区域、一个特定的时间点或一个非常狭窄的情况有关,这些情况并不普遍适用于互联网的全局受众。为了帮助使这个问题更广泛地适用,visit
例如,我有这几行代码: Hello This child element has the biggest height Just another ordinary class
这是一个包含多个索引行的 DataFrame 示例。 row_idx_arr = list(zip(['r0', 'r0', 'r0', 'r1', 'r1', 'r1', 'r2', 'r2', '
我是一名优秀的程序员,十分优秀!