Develop Reference

<iframe> Border removing, using inline script which is included within file

we have index.html in which second.html is included using iframe,
Now, as we see the iframe border in index.html
Requirement here is we need to write inline script in second.html, so that while rendering second.html in index.html, it'll remove iframe border.
we are not allowed to make any changes in that page where iframe included i.e. index.html
<div class="external">
<iframe src="/folder/second.html" width="100%" height="700"></iframe>
</div>
please suggest me the approach to remove iframe border using the file which is included in html using iframe
Sample Image:

Add this to your code
<iframe src="/folder/second.html" style="border:none;"height:700px;width:100%"><iframe>

Iframe is used to show other content in our web page. You can show videos,images and other web pages in Iframes.
You cannot make any changes in renderer for security reasons.
If that happened....then,
scripts, styles and all parts of both web pages will mix and will change design and functioning of both pages
You cannot change border of iframe from second.html. You should make changes in index.html:
<iframe style="border:0;"></iframe>
However you can make changes in some rendering pages of iframe

Overlay youtube embed with still image, along with embedding plugin in WordPress

I'm currently developing a website and custom theme in WordPress. On some of the Pages, a YouTube video will be embedded within the Page. To make it easy to update, I've used a plugin for embedding YouTube videos so when the user pastes the video URL, it embeds automatically.
The embed results in the following HTML code:
<div class="fluid-width-video-wrapper" style="padding-top: 56.25%;">
<iframe id="_ytid_72976" class="__youtube_prefs__" frameborder="0" mozallowfullscreen="" webkitallowfullscreen="" allowfullscreen="" type="text/html" src="//www.youtube.com/embed/fNKwb6dvNTE?enablejsapi=1&autoplay=0&cc_load_policy=0&iv_load_policy=3&loop=0&modestbranding=1&rel=0&showinfo=0&playsinline=0&autohide=1&theme=dark&color=red&wmode=opaque&vq=&controls=2&">
</div>
Now, I'd like to combine this with a custom thumbnail. So basically adding an image and when the image is clicked, it will be replaced with the embed with jQuery, and the video will autoplay after being replaced. Preferably with by adding an image into a div or something, because I don't want the user to have to alter the CSS or a script each time a new Page is added.
I've seen several similar questions but I couldn't quite figure out how to make it work with this plugin.
Thanks in advance!

change the navigation of an iframe

suppose I have an Iframe from other site in my page and there some links to other sites.
I want to do this
when a user click on a link in the iframe instead to navigate to the destination, the page navigate to URL I interest
<iframe src="......." width="100%" height="100%"
align="middle" frameborder="0" scrolling="yes"> </iframe>

if you are opening a cross-domain iframe it is not possible to alter the contents or for the sake anything on the page. In case you want to achieve a similar effect what you can do is
1) Save the page as HTML
2) Change the to the webiste.com so that everything works properly
3) Host this page locally on your server
4) now what you can do is open this page as iframe src so it become same domain iframe, and you can modify whatever you want just writing $('iframe').contents().<your code>
It seems like a manual process but you can write a PHP or .NET script to achieve the effect, thats how i had done it and it works perfectly.

Javascript in Iframe within Div not working

I have a webpage that I would like to embed within another page. On the page that is to be embedded I have some window.onload javascript that will load a PDF document via the embed tag. If I use just the Iframe tag like this:
<iframe name="content" id="iframe" allowtransparency="true" src="Pages/menu.html" scrolling="no"></iframe>
The Javascript will run just fine. But I am trying to create a background and border for the iframe so I have wrapped the iframe in a div like so:
<div id="content" class="border">
<iframe name="content" id="iframe" allowtransparency="true" src="Pages/menu.html" scrolling="no"></iframe>
</div>
As soon as I do it this way the javascript will not run. Here is the screenshot of what I am trying to do. I do not believe that the styling that is present on the div ( curved borders, gradient, etc is possible on an iframe)
I am using PDFObject to generate the PDF on the page. The iframe is also loading the company's external website in the content section on demand and this is what they want so unfortunately i have to use iframes. This has to be done without using anything except javascript as well otherwise I would just use php.
I have to post the SCREENSHOT outside of this site on photobucket due to restritions sorry:
http://i721.photobucket.com/albums/ww217/the_t3rminat0r/Capture-2.png

It looks margin property in div style (or border class in your example) causes the problem.

How to refresh/reload embed of application/pdf?

I have an embed code using application/pdf to show a pdf document on the page.
I used javascript to change the src attribute of the embed, which a link is clicked. then confimed using alerts to see that the src did change.
but the same pdf is still showing on the page.
How do I refresh/reload the embed tag (not the whole page)? I think this will fix it.

How do you embed the PDF? If you are using an iframe, you can use the reload method.
<iframe id="myIframe" src="your.pdf" height="200" width="200"></iframe>
<script language="javascript" type="text/javascript">
getElementById('myIframe').contentDocument.location.reload()
</script>
You can also append a random string (like the current timestamp) as a GET parameter to the PDF URL to make sure the browser doesn't use its cache.