Create Menu from Javascript


I want to know how can create a nice menu since a javascript, I have this but I want to put this javascript’s library in Vaadin Classes as InvientCharts Add-On, maybe the solution is create an add-on that contains this javascript in the GWT class, but I need a simple example with this JS. Any idea? Thanks.

I looked quickly to the page you have given but it doesn’t seem to use javascript but positioning and sizing elements statically in CSS :

	position: absolute;
	line-height: 103px;

#thumb1 img{
	max-width: 215px;
	max-height: 103px;

You can do the same with an absolutelayout or a csslayout.

Thanks Mathias for the reply, originally the code is in Javascript with JQuery, I need to do an Add-On for Vaadin, or a similar Vaadin Widget with this design :grin: I’m new in this, and I want to know how do charts in a Vaadin Widget or something similar to this example. Thanks.

Hard to tell with just this.
Depending on what you want to achieve and how the plugin work you may have to :

  • write a new full-featured layout for vaadin (quite tough)
  • write a GWT component and wrap it for vaadin as
    explained in the book
    (difficulty depends on the JS library and the number of parameters to pass between vaadin and gwt, maybe there is already a GWT version existing…)
  • use a custom layout with placeholders and add jquery in vaadin page header
    see here on how to add scripts to vaadin pages
  • Do it in pure vaadin for instance use CSSLayout or Absolute layout and recode all the jquery part in java using vaadin API. (depends on how the library works)

Thanks Mathias, but first I should to know how do a visual Widget for Vaadin, Javascript is not necessary now, just GWT. Can you give me an example about it? thanks.

The book has a full color picker sample to help you start

Thanks Mathias, I found it:

Thanks for help me. Have a nice day.

I’m finishing this add-on, I hope that you can use someday, remember that it’s based in:

It’s working in Firefox, Chrome and I.E.9.