EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Alfred on September 07, 2018, 11:09:17 AM

Title: Desktop Widget in Easyui Desktop
Post by: Alfred on September 07, 2018, 11:09:17 AM

How can I add a widget panel on Easyui Desktop. The content of the widget would be from remote data. Please see my expected output. I want something like this one:
(https://4.bp.blogspot.com/-6VMJyykheCQ/WJiGcDX-z4I/AAAAAAAAY2E/ta2sn4BYM6QQZWT1W9K14xXTqzZf6jA3ACLcB/s1600/screenlets-more.png)
Please check the link.

Please help.

Thanks and regards
Alfred

Title: Re: Desktop Widget in Easyui Desktop
Post by: stworthy on September 08, 2018, 01:19:25 AM

After create the desktop, create a panel and append it to the desktop.

Code:

$('body').desktop(...);
var p = $('<div></div>').appendTo('body');
p.panel({
	width: 400,
	height: 200,
	style: {
		position: 'absolute',
		right: 0
	},
	href: '_about.html'
})

Title: Re: Desktop Widget in Easyui Desktop
Post by: Alfred on September 09, 2018, 09:02:28 PM

Thanks this works. How do I center the panel on the desktop?

Thanks and regards,
Alfred

Title: Re: Desktop Widget in Easyui Desktop
Post by: stworthy on September 10, 2018, 01:40:05 AM

Please set the styles as:

Code:

p.panel({
	width: 400,
	height: 200,
	style: {
		position: 'relative',
		top: '50%',
		margin: '-100px auto 0 auto'
	},
	href: '_about.html'
})