Single Match Focus
Displaying match data with three zoom modes: screen-fit, horizontal-only, or borderless with animated zoom and a top-right close button.
League Series Recap
Embed any HTML content within match detail pages, combining diverse information types. This example supports preloading the next match's data based on scroll direction. Refer to our guides for touch swipe support.
Star Player Showcases
Preload match details before opening the popup via JavaScript, or use smaller images for thumbnails. Zoom effects are currently optimized for images.
Video Clips & Venue Maps
Match details automatically disable on smaller screens in this example, triggering the link's default behavior.
Dynamic Match Animations
Animation effects are achieved with simple CSS transitions; customize their appearance as needed. Discover more animations on CodePen.
Fade Slide Effect
Dialog example
This is dummy copy. It is not meant to be read. It has been placed here solely to demonstrate the look and feel of finished, typeset text. Only for show. He who searches for meaning here will be sorely disappointed.
Notifications & Fan Feedback
User input data is preserved when closing and reopening popups, or when navigating away and returning.
Instant Data Fetching
You have full control over popup content alignment via CSS, and can freely enable or disable the scrollbar.
Key Moment Replays
Modal popups block standard dismissal methods.
Modal dialog
You won't be able to dismiss this by usual means (escape or click button), but you can close it programatically based on user choices or actions.
Score Anomaly Alerts
This demonstrates a basic error message display. Text and styling can be adjusted as required.
