UI MarCom
2.3.0
latest 2.4.0 2.3.0 2.2.1 2.1.0 1.0.12
UI MarCom
Getting Started
About UI MarCom Develop Design
Fundamentals
Overview Colors Elevation Icons Image Aspect Ratios Interaction Responsive Behavior Spacing States Typography
Components
Component status Overview Accordion Alerts Application Bar Aspect Ratio Back to top Breadcrumbs Button Card Slider Cards Carousel Checkboxes Collection Date-Time-Picker Disclaimer Dropdown Feedback Module Figure Footer Header Hero Block Hotspots In-Page Navigation Label Links Lists Loading Animation Log In Dialog Logo Media Object Menu Modal Dialog Multi-column Multimedia Container Navigation bar Overlay Pagination Progress Quotation Radio Buttons Search Field Search Results Select Box Stage Steps Bar Table Tabs Tags Textfield Toggle Switch Tooltip User Identifier
Updates
Updates
Help
Contact us

Hotspots Stable

With Hotspots the user can explore content by opening detailed information on demand. They are placed as interactive spots on an image or graphic.

Usage Code

    General Guidance

    On medium and large viewports, the informative content pops up when the user clicks on a spot. On small viewports, Hotspots are numbered and the information is displayed as an ordered list below.

    1. Feature XYZ
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magn
    2. Feature XYZ
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magn
    3. Feature XYZ
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magn
    4. Feature XYZ
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magn