Live Demo
[on-Line Examples]
Introduction
euDock
is a JavaScript emulation of the Dock style MAC OS X bar.
It uses PNG, GIF, JPG (or other Web type) images, objects and transformation functions. PNG images in Internet Explorer are supported.
Using the Code
euDock
has a lot of features described in the tutorial.
In the following code, I show the basic configuration of euDock
bar.
Place the following inside your <HEAD></HEAD>
HTML tag:
<HEAD>
<script language="JavaScript1.3" src="js/euDock.2.0.js"></script>
<script language="JavaScript1.3" src="js/euDock.Image.js"></script>
</HEAD>
Later, place everywhere:
<script>
euEnv.imageBasePath="js/";
var dock = new euDock();
dock.setBar({
left :{euImage:{image:"barImages/dockBg-l.png"}},
horizontal:{euImage:{image:"barImages/dockBg-c-o.gif"}},
right :{euImage:{image:"barImages/dockBg-r.png"}}
});
dock.setIconsOffset(2);
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://www.codeproject.com"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://www.codeproject.com"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://www.codeproject.com"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://www.codeproject.com"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://eudock.jules.it"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://eudock.jules.it"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://eudock.jules.it"});
dock.addIcon(new Array({euImage:{image:"iconsEuDock/cube.png"}}),
{link:"http://eudock.jules.it"});
</script>
I suggest you download the tutorial/demos and take a look at the features. I can't explain everything here.
History
Ver 2.0.06 (17 June 2007) features
- BUG FIX:
euDock
will SURVIVE on Safari... (I don't have enough money for a Mac)
- Added delete Icon feature
- Added (optional) Target Link Location
- Now Cursor Pointer will change
- [Examples]
Ver 2.0.04 (9 November 2006) features
- BUG FIX:
euDock
can (now) SURVIVE with all kinds of prototype scripts
- Added
euCENTER
align feature to euLabel
object
- Added a NEW tutorial page
- [EXTERNAL FUNCTIONS EXAMPLES]
Ver 2.0.02 (12 July 2006) features
- Added new generic align functions (
euCENTER euHORIZONTAL euVERTICAL
)
- [ALIGN EXAMPLES]
Ver 2.0 (6 July 2006) features
- Various
Effect
objects
- Improved performances with PNG images on Internet Explorer
- Programmable zooming functions
- New tutorial and examples
Ver 2.00a (28 June 2006) features
Ver 1.06 features
- Hook and align to a fixed position
- Some bug fixes
Ver 1.04 features
- Hook and align to HTML objects
Ver 1.02 features
- Screen align: top, bottom, left, right
- Resizing images
- Link to external events
- Fading images