iFrame

The component renders another URL address (stored in the path attribute) directly in the iframe.

Live preview

Open in new tab ↗

The component renders another URL address (stored in the path attribute) directly in the iframe. The biggest benefit is auto-resizing of the iframe element according to the parent selector.

Configuration:

  • parent {String} optional, a container selector (default: window)
  • scrollbar {Boolean} optional, enables native iframe scrolling (default: false)
  • margin {Number} optional, a vertical margin (default: 0)
  • NEW: marginxs {Number} optional, a vertical margin for extra small display
  • NEW: marginsm {Number} optional, a vertical margin for small display
  • NEW: marginmd {Number} optional, a vertical margin for medium display
  • NEW: marginlg {Number} optional, a vertical margin for large display
  • NEW: message {String} optional, a link to the function(msg)
  • NEW: ready {String} optional, a link to the function(com) when the iframe is ready
  • NEW: autohide {Boolean} optional, adds hidden class if the iframe is blank

Methods:

  • NEW: SETTER('iframe/send', { your_message_data }) for sending message to the iframe

More UI components

Browse all 348