如何給圖片添加標記(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'
        });