CODEWITHSUNDEEP
jqueryfancybox
Wouter Dorgelo
Wouter Dorgelo

Reputation: 11978

iframe not populating using Fancybox v2.0.6 and jQuery 1.7.2

Ok.. Fancebox is included in my script.

I use this HTML links:

<p><a class="fancybox fancybox.iframe" href="https://twitter.com/intent/tweet?source=webclient&text=Hello+world!">twitter</a></p>

<p><a class="fancybox fancybox.iframe" href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.example.com">facebook</a></p>​​​​​​​​​​​​​​​​​​​​​​

And this JS script is added to the page:

$(function() {

$(".fancybox").fancybox({
maxWidth    : 500,
maxHeight   : 450,
fitToView   : false,
width       : '70%',
height      : '70%',
autoSize    : false,
closeClick  : false,
openEffect  : 'none',
closeEffect : 'none',
type        : 'iframe'
});
});​

When I click on one of those links, a Fancybox pops up + the target window.

In the source I see:

<div class="fancybox-wrap fancybox-desktop fancybox-type-iframe fancybox-opened" style="width: 830px; height: auto; display: block; position: fixed; top: 85px; left: 417px; opacity: 1;">
    <div class="fancybox-skin" style="padding: 15px;">
        <div class="fancybox-outer">
            <div class="fancybox-inner" style="width: 800px; height: 302px; overflow: auto;">
                <iframe class="fancybox-iframe" scrolling="auto" frameborder="0" hspace="0" name="fancybox-frame1337456160882" src="https://twitter.com/intent/tweet?source=webclient&text=Hello+world!">
                    <html>
                        <head>
                        </head>
                        <body>
                        </body>
                    </html>
                </iframe>
            </div>
        </div>
        <div class="fancybox-item fancybox-close" title="Close"></div>
    </div>
</div>

Which means that the iframe is not populated by the external content.

How do I fix this?

Upvotes: 1

Views: 1010

Answers (1)

Jashwant
Jashwant

Reputation: 29005

Twitter doesnt allow iframing. Try with another url.

You cant even do this,

<html>
<head> 

</head> 
<body> 
    <iframe src='https://twitter.com/intent/tweet?source=webclient&text=Hello+world!'></iframe>
</body>
</html>

Upvotes: 3

Related Questions