Vimeo embed on webpage causes an error - javascript

I'm trying to troubleshoot a strange bug on one of our pages (https://www.bbg.org/visit/sakura_matsuri_photos).
The bottom of left of the page has the text 'cp_vimeo_code.js Open' and I can't figure out what is generating this.
here is what it looks like
I've noticed that there are other websites that show this error too, for example: https://www.indicia.nl/project/anderson-macgyver/.
I have the following three embeds inside the body tag of a webpage in Expression Engine. Taking them out eliminates the error.
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/210978232?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/210978156?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
<div class="videoWrapper">
<iframe src="https://player.vimeo.com/video/160249045?title=0&byline=0&portrait=0" width="540" height="304" frameborder="0"></iframe>
</div>
Has anyone seen something like this before? I can't find it on Vimeo's site anywhere.
Here is a picture of the error on our page

It looks like this is a call from an addon, that's trying to load a .js file for use in the control panel. However, since you're not in the CP it'll show the call as text.
Maybe see if the addon needs updating, or, since there are a lot of video player addons that have been abbandoned, need replacing
More indepth answers can be found on EE's own Stack: https://expressionengine.stackexchange.com/

I finally figured where this was coming from, it was some extra code in a Google Tag Manger custom tag!!

Related

embed and iframe doesnt view a pdf file

Im trying to view a pdf file using html. But whenever i try to open it, the browser download the file instead of viewing it.. I dont know whats wrong. I tried embed and iframe and both results the same thing. It downloads the file.
Thing is when i see other websites, it works. so i know for sure its not because extension problems. checked the pdf viewer extension and its on.
Here is my code. how is this happening??
<div class="row">
<div class="col-sm">
<p><span class="fw-bold">DOKUMEN : </span></p>
<iframe src="http://127.0.0.1:8000/docs/testpdf.pdf" width="100%" height="100%" style="border: none;"></iframe>
<embed src="http://127.0.0.1:8000/docs/testpdf.pdf" type="application/pdf" width="100%" height="600px" />
</div>
</div>
Some browsers like IE dosent have the proper plug-in to render embedded PDF. You better work with browsers like firefox or chrome. Here is a page that answered your question before.
downloading PDF embedded file instead of viewing it

How to display "head" of web pages without scrolling iframes?

Many times I am only interested in the first portion
and would like to make a "collage", say of arriving buses at nearby stops and fit more on a small screen.
I found I can use "iframe", but having the cursor in the frame of course scrolls the frame
rather than scroll me further down the web page. Just for variety I include an image too.
Is there a better way to post "heads" of web pages? (I probably know to little about CSS and Bootstrap, etc.)
Running the snippet here shows only the traffic cam, but pasting it for example into http://htmledit.squarefree.com/ or local html file runs just fine. https://codepen.io/pen/ shows pugetsound "refuses to connect".
<div class="thumbnail-container">
<iframe height="260px" width="322px" src="http://pugetsound.onebusaway.org/where/iphone/stop.action?id=1_14961" frameborder="0"></iframe>
<iframe height="260px" width="322px" src="http://pugetsound.onebusaway.org/where/iphone/stop.action?id=1_15540" frameborder="0"></iframe>
<img src="http://www.seattle.gov/trafficcams/images/WSB_Midspan_EW.jpg" width="400" /> <!-- or a placekitten.com ;-) -->
<iframe height="260px" width="322px" src="http://pugetsound.onebusaway.org/where/iphone/stop.action?id=1_19930" frameborder="0"></iframe>
</div>
Just to show that there are other example applications I run into frequently
would be the weather for the next 2 days only, or the temperature for the last few days.
An answer to above would solve many problems.
height=380px http://forecast.weather.gov/MapClick.php?lat=47.578&lon=-122.403&FcstType=text&TextType=2
height 120px https://atmos.washington.edu/~neal/uwp/index72.cgi
If the issue is you do not want the iFrame to scroll, you can try:
<iframe src="" scrolling="no"></iframe>
iframe { overflow:hidden; }

Why doesn't this youtube instant search script allow fullscreen

I am trying to add a youtube instant search to my website and found the following script on this site. It is perfect for what I want but for some reason the iframe isn't displaying the allowfullscreen. Can someone help with this. The script is at the following url jsfiddle.net/K6Wnu/
This appears to be an issue of an iframe within an iframe. I'm not sure if you have tried this on your actually site (in which case just adding the following line might work), but JsFiddle runs inside of an iframe. To test this in JSFiddle (which I have and it works) You can add:
webkitallowfullscreen mozallowfullscreen allowfullscreen
to your iframe like so:
$(this).html("<iframe width='400' height='250' src='http://www.youtube.com/embed/"+this.id+"?autoplay=1' frameborder='0' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>");
AND to JSFiddle's iframe. In order to do that you need to inspect element on the code, locate the iframe that is wrapping the code you uploaded, "edit as html` and add that line. Here is a screen shot of it working:

Capture screenshot of iframe - html2canvas not working

I have the following iframe:
<iframe name="content" src="" style="position: absolute; left: 0px; top: 28px;" allowtransparency="true" border="0" scrolling="yes" width="100%" frameborder="0" height="90%" id="MyFrame"></iframe>
I simply want to capture a screenshot of the iframe contents as they stand, I've tried html2canvas but it doesn't seem to work. I've tried placing the iframe inside a div but no joy.
I've seen various methods of achieving this using php, but nothing that seems clear. Can anyone shed any light?
It's written in the limitations section of the doc: http://html2canvas.hertzen.com/documentation.html#limitations.
The script doesn't render plugin content such as Flash or Java
applets. It doesn't render iframe content either.
Screen capture using JS raises security problems.
Recently I've been trying carota (https://github.com/danielearwicker/carota) with some success to render HTML text on a canvas. However, it only handles a small subset of HTML.
There is also the SVG foreignobjectapproach which makes it possible to render DOM objects in a canvas: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Drawing_DOM_objects_into_a_canvas
Unfortunately, it is not implemented in IE, including IE 11.

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.

Categories

Resources