MetEd
  • Process Documentation
  • Lesson Development
  • Interactions Catalog
  • Tools
  • Introduction
  • Comet Developed
    • Calculators
      • Space Jumper Gravity Calculator
      • Pressure Gradient Force
      • Shallow Water Wave Calculator
      • Nighttime Radiation and Cooling Rates Calculator
      • Froude Number Calculator
      • Phase and Amplitude Interaction
      • Ocean Sound Speed Calculator
      • Gap Wind Calculator
      • Freezing Spray Calculator
    • Data Display
      • Dynamic Comparison Slider
      • Dynamic Charts using amCharts
      • Map with Image/Looper Overlay Toggle
      • Advanced Tabbed Loopers with frame sync
      • MCS Matrix
      • CS Matrix
      • Four Panel Looper Viewer
      • Clickable/Rollover Hotspot on Graphic
      • Checkboxes with Running Tally
      • Cims Single Panel Looper
      • Rollovers
      • User Notes with Local Storage
      • Multi-layer Drawing Exercise
    • Lesson Navigation
      • Lesson Progress Completion Tracking
      • Lesson Navigation with Single Page Return
      • Webcast Course with Single Page Return and FAQs
      • Visual Feedback of Video Completion
    • Question Variants
      • Local Storage Data Recall
      • Practice Drills
      • Map location Check Exercise
      • Branching Simulation
      • Jeopardy Game
      • Selectable Question with Validation Check
      • Dropdown Select Question with Image Preview
      • Vertical sliders with stop-values
      • Pin or object placement on image with feedback grid
      • Timeline Carousel with Tabs and Questions
      • Data and Message Building with Customized Feedback
      • Risk Matrix/Table Question
      • Input Questions with Customized Feedback
      • Card Flip Exercise
      • Question with Validation Check
      • Photo Quiz
      • Combined Drag and Draw Interaction with Background Toggle
      • Drag Interaction with Numbered Drag Elements
      • Show After Question Series with Custom Feedback
      • Embedded iFrame React App with Two-Way iFrame-Browser Communication
      • Question Series in Tabs
      • Drag & Drop Interaction with Scalable and Rotatable Transparent Overlay
    • Simulations
      • Roulette Interaction
      • Inside a Storm
      • Aim a Hurricane
      • Interactive Skew-T/Log-P Diagram
      • Hurricane Bowling Probability Game
      • Virtual Streamgage
      • Divergence & Vorticity Widget
      • Quasi-geostrophic Omega Equation Widget
  • Using 3rd Party Software
    • Articulate Storyline 360 Software
    • EdPuzzle - Interactive Videos
    • Observable Data Vis Repository
    • Sketchfab 3D Model Viewer
    • Unity 3D Game Engine
    • YouTube
  • Standalone Web Apps
    • COMET / NGS - Video Webinar Platform
    • SciEd Interactions - The Very Simple Climate Model
    • SciEd Interactions - Make a Hurricane
    • SciEd Interactions - Forecast a Hurricane
    • SciEd Interactions - Create a Snowstorm
    • SciEd Interactions - Climate Sensitivity Calculator
Powered by GitBook
On this page
Edit on GitHub
  1. Comet Developed
  2. Question Variants

Embedded iFrame React App with Two-Way iFrame-Browser Communication

PreviousShow After Question Series with Custom FeedbackNextQuestion Series in Tabs

Last updated 6 days ago

Description: This set up consists of an embedded iframe that houses a React app. The browser then establishes direct two-way communication with the React app via the iframe. This allows for a single React app build to be used while also enabling multiple question scenarios/schemes (such as ) to be used through the lesson.

Type: Integrated

Keywords: simulation, embedded, iframe, browser

Technologies: jQuery v1.11.1, React

Accessibility notes: --

Developer notes: n/a

Examples

Lesson
Link

Math for Weather and Climate: Divergence

Streamgage Basics: Troubleshooting in the Office

Estimating Tropical Cyclone Intensity with the Dvorak Technique

See on deved →
See on deved →
See on deved →
Practice Drills