如何给图片添加标记(notes)？

最近几天没有更新文章，有点小忙！呵呵，不说废话，直接进入正题。

今天主要说的是，如何在图片上添加标记（一个或多个）。从网上搜到很多的例子，总体来说，感觉这个很不错！！

我就简单说一下这个标记是怎么存储的！！首先我们放到php的运行环境下，这个index.html是调用notes这个js的，代码：

$('.jquery-note_1-1').jQueryNotes({         operator: 'notes.php', //要提交到的文件        maxNotes: 10, //最多显示标记的个数        allowDelete: false, //是否允许删除标记        allowEdit: false, //是否允许编辑标记        allowLink: false, //标记是否有链接        allowAdd: false, //是否允许添加标记        allowHide: false, //是否隐藏标记    });

当我添加标记成功之后，提交到 notes.php，数值会变成json格式，这时候是调用本身的notes.clss.php里面的某个函数，写入到文件中！（下面有例子可以下载看下）

题外：如果想存入数据库，那咱们把写入文件的那步改写成链接数据库就可以了。如果大家看的不是很清楚，可以给我留言或者去看下 官方网站。

注：我在使用的过程中，添加notes时在谷歌浏览器下可以移动到图片的外面。经过排查问题出现在样式上面（自带样式）。解决办法：打开css/style.css文件，找到.jquery-notes-container{ 这行（行数：33），把

.jquery-notes-container .notes {     position:relative; } .jquery-notes-container .notes img {     position:relative; }

这几行都删除，并且在jquery-notes_1.0.8.js里面这一行：$('#jquery-notes_'+pointer+' .notes .select').css({  加上position。 整体代码：

$('#jquery-notes_'+pointer+' .notes .select').css({             width: ID.minWidth,             height: ID.minHeight,             left: position.left,             top: position.top,             cursor: 'move',             position: 'absolute'         }).draggable({             containment: 'parent',             cursor: 'move'         }).resizable({             containment: 'parent',             minWidth: ID.minWidth,             minHeight: ID.minHeight,             maxWidth: ID.maxWidth,             maxHeight: ID.maxHeight,             aspectRatio: ID.aspectRatio,             handles: 'ne, se, sw, nw'         });