jQueryNotes仿QQ空间添加标记

jquery-notes有以下特点:

  • 支持添加备注图像
  • 丰富的API
  • 支持标记伸缩
  • 支持更改主题
  • 支持图片标记添加链接
  • 不需要数据库

HTML

首先在页面上放置一张添加标志的图片

<div class="samples-box clearfix">     <img src="samples/sample_1.jpg  width="333" height="500" class="jquery-note_1-2"     /> </div>

引入jquery和jquery-notes相关组件

<link rel="stylesheet" title="Standard" href="jquery-notes_css/style.css" type="text/css" media="all" /> <!--[if lte IE 8]>     <link rel="stylesheet" title="Standard" href="jquery-notes_css/lteIE8.css"     type="text/css" media="all" /> <![endif]--> <script type="text/javascript" src="jquery-notes_js/jquery.js"> </script> <script type="text/javascript" src="jquery-notes_js/jquery-ui.js"> </script> <script type="text/javascript" src="jquery-notes_js/jquery-notes_1.0.8.js"> </script>

调用jquery-notes插件

$(function() {     $(‘.jquery-note_1-2‘).jQueryNotes({         minWidth: ‘10%‘,         minHeight: 20,         aspectRatio: true,         helper: ‘helper-class‘,         allowLink: false,         dateFormat: ‘D.M.Y‘,         operator: ‘jquery-notes_php/notes.php‘     }); });
参数 描述 默认值
operator 远程加载列表url -
maxNotes 最大标记数量 -
minWidth 最小标记宽度 -
minHeight 最小标记高度 -
allowAdd 是否允许添加标记 -
allowEdit 是否允许编辑标记 -
allowDelete 是否允许删除标记 -
allowHide 是否允许隐藏标记 -
allowLink 是否允许添加链接 -
loadNotes 是否加载标记 -
时间: 2024-10-27 08:21:31

jQueryNotes仿QQ空间添加标记的相关文章

Fragment,仿QQ空间

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9023451          在今天的这篇文章当中,我依然会以实战加理论结合的方式教大家如何设计出自己觉得很炫的UI界面.好的,话不多说,进入正题.今天的这篇文章主要是以仿QQ空间的底部菜单栏效果为主,实现的效果有: <1>实现了点击按钮时的切换图片效果: <2>实现了点击按钮时的切换界面效果: <3>实现了点击中间圆形按钮时弹出菜单以及按钮图片切

【Android UI设计与开发】第09期:底部菜单栏(四)Fragment+PopupWindow仿QQ空间最新版底部菜单栏

转载请注明出处:http://blog.csdn.net/yangyu20121224/article/details/9023451          在今天的这篇文章当中,我依然会以实战加理论结合的方式教大家如何设计出自己觉得很炫的UI界面.好的,话不多说,进入正题.今天的这篇文章主要是以仿QQ空间的底部菜单栏效果为主,实现的效果有: <1>实现了点击按钮时的切换图片效果: <2>实现了点击按钮时的切换界面效果: <3>实现了点击中间圆形按钮时弹出菜单以及按钮图片切

ScrollView的阻尼回弹效果实现(仿qq空间)

玩过新浪微博,qq空间等手机客户端的童鞋,都应该清楚,在主界面向下滑动时,会有一个阻尼回弹效果,看起来挺不错,接下来我们就来实现一下这种效果,下拉后回弹刷新界面,先看效果图: 这个是编辑器里面的界面效果,不言自明: 运行效果: 正常界面下: 下拉: 下拉结束: 实现代码: 主要部分就是重写的ScrollView: package com.byl.scollower; import android.content.Context; import android.graphics.Rect; imp

Html - 仿QQ空间右下角工具浮动块

仿QQ空间右下角工具浮动块 <style type="text/css"> .cy-tp-area>.cy-tp-fixbtn>.cy-tp-text { display: none; margin-top: 15px; text-align: center; text-decoration: none; } .cy-tp-area>.cy-tp-fixbtn { background-color: #fafafa; color: #8c8c8c; } .

安卓开发之Kotlin和java双实现仿qq空间下拉图片拉伸

先不扯淡看今天要实现的效果: 话说使用Kotlin实现安卓功能,那我们还是要做一点准备工作,so,你得加一点插件到eclipse或android studio.然并卵,你现在还在使用eclipse开发的话我只能提供地址Kotlin Plugin for Eclipse,然后我使用的还是死丢丢. 死丢丢(android studio)集成kotlin安卓开发 要使用android studio开发kotlin的安卓app,那么你必须有开发kotlin的环境: Kotlin插件.打开Android

IOS仿QQ空间时间显示

最近项目有类似QQ空间展示动态的UI,模仿了QQ空间的时间显示,在此记录,以备查阅. 这是QQ空间的ui: 时间显示为: 1.今天-->今天 xx:xx(今天 15:39)   2.昨天-->昨天 xx:xx(昨天 06:00)   3.前天-->前天 xx:xx(前天 19:00)   4.同一年, 例如:同一年的一月三号-->01-03 xx:xx(01-03 12:29)   5.不在同一年 --> xxxx-xx-xx(2014-12-12) 程序运行效果如下,以下为

仿QQ空间图片放缩查看

仿QQ空间图片放缩查看 仿QQ空间图片放缩查看,点击图片从原位置放大到全屏,后退从全屏缩小到原位置,效果非常好. 下载地址:http://www.devstore.cn/code/info/830.html  运行截图:   

iOS_28仿QQ空间登录与退出

最终效果图如下: 注意事项: 输入框的return Key Main.storyboard中为 LoginController 设置一个storyboardID, 以便可以在代码中通过Storyboard对象实例,创建Main.storyboard里面的控制器 仿QQ窗口抖动 dispach_after模拟延时 输入框的return Key的不同处理方式 Login控制器代码 // // LoginController.m // 28_QQ空间 // // Created by beyond o

仿QQ空间送礼物功能

本文链接:http://www.cnblogs.com/dengxinglin/archive/2013/03/23/2976737.html 我们在QQ空间里面有一个送礼物的功能,显示了最近过生日的人.我们只要把鼠标放到如下图的生日快乐那标签上,就会显示可以给该人送的礼物!! 单击其中的一个礼物,就会马上送出去.但是我们现在是要说的还有单击更多的时候,会另外弹出一个新的窗口在当前页面最前面!如下图显示: 怎么实现那上面的功能呢? 就是把鼠标放上去,弹出一天tips,单击tips里面的控件,之后