Как создать страницу демо-семплера Vaadin

У меня простой вопрос, я пытаюсь создать что-то похожее на то, что находится в этом URL. Посетите: http://demo.vaadin.com/sampler-for-vaadin6

В частности, я хочу знать, как создать те поля, на которые можно нажимать? Я не уверен, что это? являются ли они ссылками, изображениями или кнопками?

Я также что коробка вокруг него, когда мышь перемещается по этим коробкам. Любой образец кода высоко ценится.


java vaadin
person sbolla    schedule 02.08.2013    source источник
comment
Вы пытаетесь сделать это с фреймворком Vaadin или без него?   -  person rcheuk    schedule 02.08.2013
comment
Мне не совсем понятно, о чем вы просите. Есть много способов воспроизвести это, но это зависит от ваших потребностей и используемых существующих технологий.   -  person rcheuk    schedule 02.08.2013

Ответы (2)


arrow_upward
1
arrow_downward

Страница сэмплера создается с помощью Vaadin. Согласно FireBug, это сделано с помощью CSSLayout, и эти поля сделаны со ссылками. Эффект наведения создается с помощью следующего атрибута css:

.v-csslayout-grid .screenshot a:hover span {
    background: url("screenshot-frame-hover.png") no-repeat scroll 1px 0px transparent;
}
person nexus    schedule 02.08.2013

arrow_upward
0
arrow_downward

Вы можете найти код «относительно» последней версии семплера Vaadin 6 здесь.

По крайней мере, эта версия (я считаю, что это 6.7.4) должна дать вам несколько примеров того, что вы ищете.

person Lundahl    schedule 02.08.2013