Quarto RevealJs video autoplay - html5-video

I have a video in a slide:
![](video/filename.mp4)
and I have set YAML option for global autoplay:
format:
revealjs:
auto-play-media: true
but on page the video is not autoplaying.
I have searched and most results relate to RevealJs only rather than Quarto and suggest a raw HTML format (e.g. below) which when I try in Quarto is not recognised:
<video data-autoplay src="http://file.mp4"></video>
Please help. P.S. I understand the first slide may not autoplay but this is a slide in middle of deck.
I am trying to switch from Powerpoint to Quarto.

Related

SVG with images with dataURL href not rendered correctly in some engine

This SVG originated from HTML5 canvas. Which looks fine and I added images that are represented in dataurl form to avoid CORS issues.
However, when opened in chrome the image showed up fine
When opened in Adobe Illustrator, the image did not show up.
When opened with macOS preview app, the image did not show up.
I looked up SVG2 specifications for using dataURL in svg's <image> tag href attribute and they said its okay to use. So I don't understand what is causing this rendering discrepancy between different viewers.
File for reference
In short, what is the standard way to embed images into SVG.
Okay I found out it is because only Chrome supports the newer SVG2 standard href attribute on <image> element of SVG. So I just needed to replace the href with xlink:href
Even though xlink:href attribute is deprecated in SVG2. It seems the other softwares aforementioned in the question are not SVG2-compliant.

Can I force phantomjs to render pdf's with the background images and colors

Using phantom JS 1.9.7 I am having issues printing my webpage to PDF.
Instead of matching the page exactly, background colors and images are stripped, as per:
How can I force browsers to print background images in CSS?
Thanks to a post on another question, here is the answer:
body {
-webkit-print-color-adjust: exact;
}
You can add the CSS style "-webkit-print-color-adjust: exact;" to the element to force print the background color and/or image.
See the documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-print-color-adjust
Odd how this is on MDN.

highcharts display in my render html page which i want to convert into PDF using wkhtmltopdf in rails

I have an html page with some text data and graph. I am using wkhtmltopdf gem to generate pdf from html page. Using highcharts, i am generating graph.
I am able to generate PDF successfully but PDF only contains text
data and doesn't have graph in it.
I already tried with some options as below
- plotOptions: { series: { enableMouseTracking: false, shadow: false, animation: false } }, in Hightcharts jquery coding..
Please assist me to resolve this issue.
I am not familiar w/wkhtmltopdf but I do use wkhtmltoimage to create images of pages that contain graphs from highcharts. One thing I noticed is that I had to set --javascript-delay to be several seconds long to make sure the chart had enough time to load. It seems as though wkhtmltopdf does support this option (wkhtmltopdf v0.10.0_rc2 docs). Can you see if that helps?
Here is how we call it w/a javascript delay of 3 seconds:
/bin/wkhtmltoimage --javascript-delay 3000 "http://example.com/chartPage" "/path/to/image.png"

Can I show a PDF inside a DIV with a zoom function?

I have a large PDF and I need to show it 50% reduced in size inside a div tag that is 600px 600px in size. I also need to offer the client a zoom function.
Should I use the "object" tag? But can I reduce the pdf size inside an "object"?
Is there a jquery example or anything out there?
Need help.
<div>
<object data="febrero2012.pdf" type="application/pdf" width="600px" height="600px">
alt : febrero2012.pdf
</object>
</div >
I coudn't find the way to set a default zoom level yet. If you find a way, please let me know.
No. PDFs cannot be displayed in a DIV, as they're not html or an image. You can convert the PDF to html/images on the server and display that, just like google's "quick view" function does. But in general, PDF rendering in-browser is dependent on the presence of a plugin (e.g. Adobe Reader, Chrome's built-in rendering engine notwithstanding). Plugins can't be displayed in divs, just embed/object/iframe sections.

Flash object not loading in Safari

I've built a form, and next to my form element I've placed a flash object. When the page is loaded, the form is display: block, and the flash object is display: none.
The layout looks something like (the img is there so that if the user doesn't have flash, the gif animation will play instead):
<form id="form"></form>
<div id="upload-anim-div">
<object type="application/x-shockwave-flash"
data="<?= PAL_STATIC_HOST ?>/music/introducing/flash/upload_animation.swf"
width="626"
height="600">
<param name="movie" value="<?= PAL_STATIC_HOST ?>/music/introducing/flash/upload_animation.swf"/>
<img src="<?= PAL_STATIC_HOST ?>/music/introducing/img/Anim-placeholder.gif" alt="upload animation (gif)"/>
</object>
</div>
When I submit my form, which is just to upload a file, I hide the form and display my animation div as follows in javascript:
$('#form').hide();
$('#upload-anim-div').show();
This works great in all browsers except Safari, where a big white space appears. Right clicking this white space simply gives me the following menu:
Flash movie not loaded... _not clickable_
About Adobe Flash Player 10.5.blah...
Why is the movie not loaded/loading?! If I simply display the movie when the document first loads (by removing the javascript line that initially hides it) it loads and displays fine! Any ideas would be greatly appreciated!
---EDIT---
I've now tried using swfobject, but get exactly the same problem. I used this kind of code in my javascript to embed my swf with javascript after displaying the upload-anim-div:
swfobject.embedSWF("myContent.swf", "upload-anim-div", "626", "600", "10");
Anyone have any further ideas?
Sounds like Safari tries to shave the page load time by not rendering Flash in a hidden div. How are you putting the Flash into the div, is it just an object tag, or are you using something like swfobject? If you're using swfobject you could write the Flash to the div when you reveal it.
I think you should try to embed your Flash content with swfobject: