Skip to main content
R
rsbisa
Inspiring
February 10, 2019
Answered

iframe content control from single responsive page/menu

  • February 10, 2019
  • 4 replies
  • 2651 views

Hello experts!

Is there a way to control content from within an iframe using a main menu without refreshing the browser at each menu selection?

The detail of my need is: I've created eight standalone but associated Adobe Spark presentations (my original content was simply too lengthy for a single Spark presentation). Let's say each of the 8 presentations has 10 pages/slides. WISH #1: I would like to command the presentations from a single, responsive webpage's menu so User may select from any of the 8 topics from the menu and have the iframe refresh and point to the selected Spark presentation - but without refreshing the entire page.

I do understand the above could be sort of accomplished by simply having 8 separate web pages with a dedicated iframe for each Spark presentation. But I'm trying to create a workaround to overcome the challenge of Spark [weirdly] not having any sort of menu capabilities. I want User to have the sense that User is in an app-like environment where they are controlling content from a menu; not simply refreshing their browser in their phone, tablet, or PC.

Thanks!

This topic has been closed for replies.
Correct answer Nancy OShea

Thanks. This would work, but this is pretty much what I'm doing now. The problem is, when User clicks off to an individual Spark presentation, User then must click a back button to get back to the home menu; rather than simply selecting another Spark from the menu. If I place a button, say, Home, in each Spark presentation, the button will take me to the Home menu -  but in a new browser window. In short time, User could have a dozen browser windows open. Ideally, I need for any of 6 to 10 [actual and fully responsive] Spark presentations accessible from a single menu. It's okay if the menu browser must refresh at each click. But, that menu has to be available each time, and the same browser window.

Thanks again!


If Spark had the option to make channels or playlists the way YouTube does, you could embed that directly into your web page.  But until that's available, I don't think what you want is feasible.

Spark feature request

Community feature requests for Adobe Spark!

4 replies

P
Paul-M
Legend
February 10, 2019

If you can post link and we can help you more effectively ...

Paul-M - Community Expert
BenPleysier
Community Expert
BenPleysierCommunity Expert
Community Expert
February 10, 2019

In addition to Energize's answer, try the following: Copy and past the following code into a new Dreamweaver document

<!doctype html>

<html>

  <head>

    <meta charset="UTF-8">

    <title>Untitled Document</title>

  </head>

  <body>

    <iframe width='100%' height='800' src='https://slate.adobe.com/a/74EGR' frameborder='0' scrolling="yes" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

  </body>

</html>

Change the source to your own link.

You can then add a navigation bar so that you can link to other pages. See the result at https://petersonphenomenon.org/spark

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
R
rsbisaAuthor
Inspiring
February 10, 2019

Thank you. This works, mostly.

But I now see that the iframe is not as responsive as I would like. The Spark presentation conforms to the iframe dimensions and not the viewing phone or tablet. If you can view this on your phone, you'll see that the Spark elements remain very small when compared to the actual Spark presentation.

Your suggested iframe examplebox.com/lorem2http://examplebox.com/lorem2

The actual Spark presentation.

P
Paul-M
Legend
February 10, 2019

Css might look soemthing like this to make it responsive:

iframe {
   width: 100%;
   height: 100%;
   border: 0;
}
Paul-M - Community Expert
P
Paul-M
Legend
February 10, 2019

If you need more explanation let us know ...

Paul-M - Community Expert
P
Paul-M
Legend
February 10, 2019

Here's an example:

iFrame target

Paul-M - Community Expert
R
rsbisaAuthor
Inspiring
February 10, 2019

Thank you. This works, mostly.

But I now see that the iframe is not as responsive as I would like. The Spark presentation conforms to the iframe dimensions and not the viewing phone or tablet. If you can view this on your phone, you'll see that the Spark elements remain very small when compared to the actual Spark presentation.

Your suggested iframe examplebox.com/lorem

The actual Spark presentation.

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices