xara slideshow, google fonts & fontawesome

[FLySOLO]

Hey Acorn,

thx for your fast reply. I replaced the two xara-Slide-shows with a xara website in an iframe and this script (which i didn't get to work so copied the xara file from an old website where i did the same):

<script>
sDispTimes=[4];
function sswitch(){
var n=xr_curp+1;
if (n==xr_spapn)n=0;
xr_spapp(n);
setTimeout(sswitch,sDispTimes[n%sDispTimes.length]*1000);
}
setTimeout(sswitch,sDispTimes[0]*1000);
</script>
<style>
.zoomThis{
animation: slideZoom linear 10s;
animation-iteration-count: 1;
transform-origin: 50% 50%;
-ms-animation: slideZoom linear 10s;
-ms-animation-iteration-count: 1;
-ms-transform-origin: 50% 50%;
}

@keyframes slideZoom{
0% { transform: scale(1.00); }
100% { transform: scale(1.50); }
}

@-ms-keyframes slideZoom {
0% { -ms-transform: scale(1.00); }
100% { -ms-transform: scale(1.50); }
}
</style>


It works and all the cross-referenced google stuff is gone.


bb and thx again,

Fly

FLy, thank you for going into all the detail.
I have move your Thread to the Dear Xara forum.

Xara will have built the Xara Slideshow widget ahead of GDPR or it wasn't fully aware.
Xara has a habit of not reviewing its own widgets (one of the worst is the QR Code Generator widget; another is the Embed a Website widget) where technologies (jQuery, CSS, SVG) or regulations (GDPR) impact on them.
Xara should not proclaim a code-free environment but leaves its customers to fight through the problems it creates.

I do not use the Xara Slideshow widget for these reasons, not to mention poor server availability and the third-party hosting aspects.

Acorn

[Acorn]

Hey Acorn,
thx for your fast reply. I replaced the two xara-Slide-shows with a xara website in an iframe and this script (which i didn't get to work so copied the xara file from an old website where i did the same):

<script>
sDispTimes=[4];
function sswitch(){
var n=xr_curp+1;
if (n==xr_spapn)n=0;
xr_spapp(n);
setTimeout(sswitch,sDispTimes[n%sDispTimes.length]*1000);
}
setTimeout(sswitch,sDispTimes[0]*1000);
</script>
<style>
.zoomThis{
animation: slideZoom linear 10s;
animation-iteration-count: 1;
transform-origin: 50% 50%;
-ms-animation: slideZoom linear 10s;
-ms-animation-iteration-count: 1;
-ms-transform-origin: 50% 50%;
}

@keyframes slideZoom{
0% { transform: scale(1.00); }
100% { transform: scale(1.50); }
}

@-ms-keyframes slideZoom {
0% { -ms-transform: scale(1.00); }
100% { -ms-transform: scale(1.50); }
}
</style>

It works and all the cross-referenced google stuff is gone.
bb and thx again, Fly

Fly, so you've used siran's code to cycle round a presentation website with a fixed time of 4 seconds per slide.
The style code can be simplified further by removing the vendor prefixes:

<style>
.zoomThis {
animation: slideZoom linear 10s;
animation-iteration-count: 1;
transform-origin: 50% 50%;
}
@keyframes slideZoom {
0% { transform: scale(1); }
100% { transform: scale(1.5); }
}
</style>

I am guessing the zoom in of 10 seconds to 150% is never reached as you are switching every 4 seconds?

Acorn