基于jQuery的图片标记插件LipZoomMark(原创)

所属分类:媒体-图片展示

 34868  333  查看评论 (16)
分享到微信朋友圈
X
基于jQuery的图片标记插件LipZoomMark(原创) ie兼容11

更新时间:2018/5/8 下午5:05:47

更新说明:修改了Firefox不兼容的问题


简介

一款支持图片缩放、拖动、旋转、添加标记的基于Jquery的插件。

右键添加标记,左键按住移动鼠标可拖动,滚轮可以缩放画布。

使用方法

初始化(Jquery自己引用好)

<div id="container" ><img src="./assets/demo.jpg"></div>
<script type="text/javascript">
    $('#container').ZoomMark();
</script>

重置画布

$('#container').ZoomMark('reset');

旋转画布

$('#container').ZoomMark('rotate',90);

修改标记颜色

$('#container').ZoomMark('changeSettings',{'markColor':'#d31145'});

删除标记

$('#container').ZoomMark('deleteMark',id);
相关插件-图片展示

jQuery背景墙聚光灯效果代码

jQuery背景墙聚光灯效果代码
  图片展示
 31446  330

jQuery点击图片预览并显示详情

jQuery点击图片预览并显示详情,加入购物车,适合简单的商城系统
  图片展示
 51420  696

jQuery放大镜插件imgzoom.js

jQuery图片放大插件imgzoom.js
  图片展示
 27918  317

在圆点上不断滑动鼠标看看效果

图片以圆点显示,随着鼠标的滑动,圆点的尺寸越来越小,图片越来越清晰
  图片展示
 32398  450

讨论这个项目(16)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    山在高上 0
    2021/2/3 10:16:24
    怎么我动态插入图片会出现鼠标滚轮一滚,图片就消失的问题呢? 回复
    星辰 0
    2020/8/12 14:23:32
    我想获取坐标存入数据库,然后查出来还能显示在页面上怎么办 回复
    I have my dream 0
    2019/11/15 15:49:35
    最终的图片解决了。。。
        老农0
        2020/6/10 11:09:06
        亲,怎么解决的?
    回复
    I have my dream 0
    2019/11/15 15:44:11
    怎么获取最终的图片,好像没有回调呀? 回复
    I have my dream 0
    2019/11/15 10:44:33
    你好,怎么设置图片不拖动?操作的时候不让拖动。 回复
    9久~ 0
    2019/10/22 14:44:35
    怎么对放大缩小进行限制 回复
    呵呵哒哒 0
    2019/7/11 19:47:13
    为什么使用插件图片会变形啊? 回复
    不倒翁 0
    2019/6/26 15:42:40
    你好 考虑支持拖拽四个角 改变大小吗
        不倒翁0
        2019/6/27 9:28:21
        拖拽不流畅是什么原因
    回复
    隔壁老王 0
    2019/3/6 13:04:14
    【移动端】标记可以拖动吗?图片支持手势放大缩小吗? 回复
    阳光 0
    2018/12/25 9:50:39
    标记填写的文字可以显示在页面上吗?标记可以拖动吗? 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复