Окно-превьюер
Контрол, отображающий всплывающее окно-превьювер, относительно указанного элемента. Окно открывается автоматически по событию указанному в опции trigger. В один момент времени на странице может отображаться только одно окно-превьювер.
Базовая конфигурация контрола
Для базовой настройки необходимо задать две опции: content — область при взаимодействии с которой должно открываться окно и template — содержимое окна.
Можно задать событие, которое запускает открытие окна-превьюера в опции trigger. Значение по умолчанию hoverAndClick
.
Возможные значения опции: trigger
- hover — окно-превьюер появляется при наведении на контент.
- click — окно-превьюер появляется при клике на контент.
- hoverAndClick — окно-превьюер появляется при наведении на контент или клике по нему.
- demand — прикладное событие вызова окна-превьюера.
<!-- WML -->
<Controls.popup:PreviewerTarget
trigger="hover"
template="wml!file2"
templateOptions="{{_templateOptions}}">
<ws:content>
<div>
Для появления подсказки наведите на контент курсор мыши
</div>
</ws:content>
</Controls.popup:PreviewerTarget>
<!-- file2.wml -->
<div>
<img scr='{{image}}'/>
{{name}}
</div>
// TypeScript
class Test extends Control<IControlOptions> {
protected templateOptions = {
image: '/myPhoto.png'
name: 'Иван Иванов'
}
}
О реализации раскладок окон подробнее читайте здесь.