javascript - 如何根据封面照片的 div 高度和位置调整图像大小?

标签 javascript jquery html css twitter-bootstrap

我有一张封面个人资料照片,可以在我的网络应用程序中更改,就像 Facebook 封面个人资料照片一样。我已经用jquery UIdraggable插件实现了重新定位照片的功能,并且还实现了上传新照片的功能。

对于重新定位,我是这样进行的:

  • 在表单上添加隐藏输入字段并保存最新的top

  • 加载页面时,top 值将设置为数据库中保存的值。

例如,这是我的 PC 屏幕上的一个案例,顶部设置为 top: -166px; enter image description here

这就是我在移动 View 上看到的:

enter image description here

我的电脑屏幕上一切正常。问题是,在小型设备上,它与我重新定位的照片位置不同,而是在某些小型设备上拖动照片时出现一些问题。

有人知道如何纠正这个问题吗? 或者有没有其他插件可以做到这一点?

提前致谢。

最佳答案

我建议你使用CSS而不是JS。您可以将图像设置为 background-image

属性并用 background-size 配置它属性(property)

关于javascript - 如何根据封面照片的 div 高度和位置调整图像大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47094156/

相关文章:

javascript - AJAX - 提交多个 POST 数据

javascript - (Javascript) 解构对象但对象有更改日期

javascript - 指定weekYear时可以使用momentjs对象构造函数吗?

javascript - 不允许在 jquery-simple-datetimepicker 中选择过去的日期和时间

javascript - 如何通过 jQuery 中元素的索引设置数据属性值?

php - 在 PHP 中为 MVC Controller 合并 INSERT Mysql 查询

javascript - 绘制后单击按钮删除多边形

javascript 动态改变背景

javascript - 用 Twitter Bootstrap 的模式替换标准的 javascript 确认 - 谁触发了它?

javascript - 为同名的多个类抓取浮点值