View Full Version : how to show the jquery sticky notes to the extjs 4 desktop

11 Jun 2012, 4:16 AM
hi.. sencha forum member
I am having one problem with showing the jquery sticky notes to my desktop viewport. below is the link from where i had downloaded the stick notes of jquery.


I tried with the below code to show sticky notes to my desktop viewport. But don't know why its not showing to my desktop.

<%@ page language="java" contentType="text/html;UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="en_GB" lang="en_GB">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link rel="stylesheet" type="text/css" href="ext-4.0.2a/resources/css/ext-all.css"/>

<!--Application CSS files-->
<link rel="stylesheet" type="text/css" href="resources/css/desktop.css">
<link href="resources/css/style.css" rel="stylesheet" type="text/css" />

<!-- Jquery javascript here -->
<script type="text/javascript" src="jquery/script/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery/script/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="jquery/script/jquery.stickynotes.js"></script>
<link rel="stylesheet" href="jquery/css/jquery.stickynotes.css" type="text/css">

<!--Ext JS files -->
<script type="text/javascript" src="ext-4.0.2a/ext-all-debug.js"></script>

<script type="text/javascript">
// wait for the DOM to be loaded

// wait for the DOM to be loaded
$(document).ready(function() {
var options = {notes:[{"id":1,
"text":"Write your Notes Here.. .",
"pos_x": 1000,
"pos_y": 25,
"width": 200,
"height": 200



<div id="notes" style="width:100%;height:100%; z-index:-1"> </div>


I noticed that when my desktop is loading it appears and suddenly gone away.

please suggest me why the sticky notes didn't shown properly to my desktop.

11 Jun 2012, 9:20 AM
Do you receive any errors in the console?
Does this happen in all browsers?
Have you tried a later version of Ext? 4.02a is very old.


16 Apr 2013, 8:12 AM
Yeah, i'm in the same problem too, i dot not how to execute the stiky note inside the desktop, :-?

25 Apr 2013, 3:18 PM
anybody has been done this before?:-? thanks.

29 Apr 2013, 10:09 AM
I did it, i just had to find the correct Div of the Desktop App: #id_shortcut_dataview

$(function() { $("#id_shortcut_dataview").stickyNotes(); });

Check this Out Extjs + Jquery app:
That's all Folks ;)