Syntax to include an iframe

HYi,
Thanks,
they remain some important problems.

The syntax is

<a href="https://www.facebook.com/.../posts/..1290182" class="fancybox-iframe">
Link to iframe source
<iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2...%2Fposts%...290182&width=500" width="500" height="707" style="border:none;overflow:hidden " scrolling="yes" frameborder="1" allowTransparency="true" allow="encrypted-media"></iframe></a>

This produces :

• If I don’t add the text “Link to iframe source” there is no clickable zone into the iframe
• The click opens the link into a new tab, and when you switch to the previous current tab
• You get an empty lightbox

Important, I meet another problem with images, the image is too opened into a new tab but the image is displayed into the fancybox.

The iframe and images are displayed into boxes of “colorbox” plugin.
I would intend to develop a way to display the boxes into fancybox or elements of their content (the purpose of this message). for now

What can I check ?
Note : I have no problem with js,html,css development and debug mode (chrome).
Note: I used a while to check the content of the light box (fancybox-wrap) and I think that I found a major cause of the problem : EasyFancy rebuilds the iframe using the main href of alink and facebook seems to refuse and send nothing while with the upward syntax of the link colorbox receives a good code. I am going to perform some complementary test

Best regards

Trebly

Hi,

I answer to your questions and recommendations here.
But I will try to explain in another way what I want to do and what I mean.

I have a site page (with colorbox which shows partialy several iframe which can be reduced and/or truncated or miniaturized. So I want to bring the same iframe, each one separately, into a light box well sized with easy FancyBox.

This is possible, even it is a facebook item, the html instruction which function has
the following code which is first generated by js of Easy Fancybox and slighly manually modified (with debugger) is :

<div id="fancybox-wrap" style="width: 500px;height: auto;top: 1652px;left: 241px;display: block;">
  <div id="fancybox-outer">
    <div class="fancybox-bg" id="fancybox-bg-n"></div>
    ....
    <div id="fancybox-content" style="border-width: 1px;width: 500px;height: 744px;">
      <THE IFRAME ..... >
    </div>
    ...
  </div> 
</div>

note : I just change the width of divs and the src of the iframe from the nearest result obtained

My question is how to generate original html content to display the result which is able to display the same content than the iframe into a light box well sized.

There are two syntax to get the nearest result from the target :

• Simple link with class fancybox-

  <a href="https://www.facebook.com/anne.tachene/posts/10218047851290182" class="fancybox-iframe">
  Open here the item facebook (this text is added because the iframe is not clickable)<br>
  <iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2Fanne.tachene%2Fposts%2F10218047851290182&width=500" width="500" height="707" style="border:none;overflow:hidden " scrolling="yes" frameborder="1" allowTransparency="true" allow="encrypted-media">
  </iframe>
  </a>

• Quite the same give the same result by close A tag before the iframe, the difference is for analyse by js,

I explain :
both

• Open a new tab on the facebook item in the current user context of facebook (logged in)
• Open a light box into the previous tab from which we have started. But this fancybox is empty

So regardless the purpose there to errors :

• Empty Fancybox
• the facebook item is opened into a new tab while we are waiting a fancybox popup on the current tab. Long complex, bad ergonomy and no interest

Why the fancybox is empty ?
Because the link used is not the link of the item as it is into the iframe, it is cleaned and compressed.
Into the iframe generated by Easy Fancybox to populate the box we need to use the extended src, as defined upwards, for the iframe.

I checked this, by a manual change into the code generated by using debogger, and it function perfectly. We have just to be full perfect to adjust the width of the container at the with of the query of the url.

Note that if you send from console the command :
`window.open(“extend full url with width of your choice”) you get a new tab with the right content.

So for Facebook and may be many other sites there are little adaptations to perform into the script for iframes.
The fact that the soft ignores the iframe into the first syntax can be useful for the analyse to get the full url and the width parameter which can be adapted at the available width.

Must I go to js code to do this ?

Best regards

Trebly