JavaScript 图像缩放和平移(拖动)

标签 javascript jquery jquery-ui

关于缩放大图像和平移有什么建议吗?最好内联在页面上。

我一直在使用PanoJS(又名GSV2),但是现在越来越多的人使用iPhone/iPad/Android类型的设备,这个库要么太慢,要么旧版本不支持拖动(我正在使用的那个)目前)。

http://code.google.com/p/panojs/

http://www.dimin.net/software/panojs/

我目前的想法是,使用平铺图像方法对于这些小处理器来说太过分了(在最大缩放时尝试从 3000 x 3000 像素的原始图像中拖动 144 个单独的图像,其中每个图 block 为 250x250 像素)。

所以可能更多地考虑在具有设定宽度/高度的情况下加载原始图像...并且编写我自己的JS来缩放/拖动,或者使用另一个库(我目前似乎找不到)...然后是使用 jQuery(使用 jQuery UI 来支持可拖动)的问题,或者只是自己编写原始 JS 以减少代码量。

最佳答案

更重要的是回答我自己的问题,因为标准库似乎没有达到我需要的效果,我最终创建了自己的解决方案:

https://github.com/craigfrancis/zoomify

目的是您可以复制此代码,然后根据您自己的特定要求对其进行自定义...因此理想情况下,您应该能够阅读/理解代码,而不是仅仅将其放入您的项目中并希望得到最好的结果.

关于JavaScript 图像缩放和平移(拖动),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11327274/

相关文章:

javascript - 隐藏屏幕阅读器中的所有元素(一格除外)?

javascript - RxJS 映射在执行订阅之前返回数据

jquery - 使用 jquery 显示/隐藏下拉菜单中的选项

jquery - 使用 JQuery 编码折线

javascript - Youtube API - 使用 "this"播放当前视频

javascript - 将 d3-force-3d 计算插入 3D 图形渲染器

javascript - 如何禁用除 jquery datepicker 中选定日期之外的所有其他日期

javascript - Jquery UI 中的拖放事件

javascript - 如何限制在 JQGRID 中的 Header Select All 事件中选择特定行

javascript - 如何使文本框在单击时向后移动(jQuery)?