В связи с тем, что я повсеместно пытаюсь избавиться от ASP.NET AJAX Control Toolkit (ACT) и перейти на использование jQuery, то от использования Hover Extender от ACT пришлось отказаться. Сразу же было найдено большое количество разнообразных плагинов для jQuery, но большинство из них имели недостаточную реализацию, из-за чегоостановился на jQuery plugin EZPZ Tooltip.
Из основных достоинств данного плагина хочется выделить:
- “Чистый” HTML - не нужно добавлять специальные атрибуты для элементов, плагин завязывается на отдельный HTML элемент.
- Конфигурация через наименование (Convention over configuration) - поведение элементов зависит от из ID.
- Гибкие настройки - с помощью CSS можно настроить как внешний вид контрола, так и его позиционирование.
- Возможность замены стандартных эффектов путем перехвата соответствующих событий на jQuery.
- Удобство и простота работы.
- Маленький размер - 4.5K в сжатов виде.
Более подробно о всем этом можно почитать на странице проекта, а я хочу рассказать как можно его использовать в связке с ASP.NET на примере простого UserControl.
Для инициализации контрола нужно выполнить небольшой javascript:
$("#example-target-1").ezpz_tooltip();или$("#target").ezpz_tooltip({contentId:“content”}); - В случае если у наших HTML-элементов будут “нестандартные” для этого контрола ID.
Так как, ASP.NET сам генерирует нам ClientID элементов (я не учитываю специфику ASP.NET 4.0, где можно отключать автоматическую генерацию ClientID), то приходится использовать 2-й вариант таки образом:
При этом у нас:
- TargetControlId - ID элемента, при наведении на который будет отображаться наш hover (tooltip).
- ContainerClientId - ID элемента который будет показываться в качестве hover (tooltip).
Разметка нашего user control выглядит так:
Нам остаётся только разместить наш UserControl на странице и подключить необходимые стили и скрипты. Можно ещё сделать WebControl, но это уже зависит от конкретной задачи. В моём случае UserControl был предпочтительнее.