AlexeyBoldin
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by AlexeyBoldin
-
-
After a few corrections Yandex accepted this code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://awaps.yandex.net/data/lib/adsdk.js"></script>
<meta charset="utf-8" name="ad.size" content="width=320,height=268">
<title>320x268_YandexVideo</title>
<!-- write your code here -->
<script>
function getUrlParam(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
</script>
<style>
body {
margin: 0px;
height: 100%;
overflow: hidden;
cursor: pointer;
}
#video {
border: 1px solid gray;
width: 100% !important;
height: 100% !important;
min-width: 320px;
max-width: 1080px;
min-height: 268px;
max-height: 328px;
object-fit: contain;
position: fixed;
margin: auto;
left: 0;
right: 0;
bottom: 0;
top: 0;
display: block;
background-color:rgba(00, 00, 00, 1.0);
}
</style>
</head>
<body>
<video id="video" width="400" height="224" controls>
<!--<source src="video_for_banner.mp4" type="video/mp4">-->
</video>
<script>
var video = document.getElementById('video');
video.addEventListener('canplaythrough', function() {
this.pause();
});
video.src = getUrlParam('video1');
document.getElementById('video').onclick = function() {
if (video.paused && ! video.ended) {
video.play();
video.setAttribute("controls", "controls") ;
return;
}
window.open(getUrlParam("link1"));
homeExpandableMobileBannerAPI.close();
};
document.body.addEventListener('click', function (event) {
if (event.target.tagName.toLowerCase() !== 'body') {
return;
}
onCLickBody()
}, true);
function onCLickBody(){
window.open(getUrlParam("link1"));
homeExpandableMobileBannerAPI.close();
}
</script>
</body>
</html> -
Dude, it's incredible! Thank you so much for your help, looks like it works! I will write a Yandex response later when they answer =)
-
@AlexeyBoldin Does this example work for you?
Wow =) , it works! But what is the difference?
Can you explain it to me? This is the same code, or you made some modifications?
Surely that's something you can push back to them. If you are creating new formats they must provide working examples.
How about picking another format that has a video and a template and cannibalizing some of it to use in this new format?
This is Yandex. With them it is very difficult to negotiate about something.
In any case, I sent them what I've got, let's see what they say.
-
Thank you for your advice! I replaced the video on this from the example. And it is has not given result. Video still played directly, but it is not loaded by variable...
Typically, Yandex does not negotiate with its advertisers. If something does not work, they say you have to do in accordance with the requirements. There is not much help. This format is 1 week old. Unfortunately, they were told that there are no examples.
-
I totally deleted this piece of code but nothing happened...
<a id="click1_area" href="#" target="_blank" style="width: 100%; height: 100%; cursor: pointer; position: absolute; z-index: 9;"></a>
-
You can see all the things here, maybe I missed something...
And thanks again for your help!
-
Now the code looks correct in your opinion?But the video still does not load on my server if i commented
<source src="video_for_banner.mp4" type="video/mp4">
... The player does not show an error. It just empty.
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://awaps.yandex.net/data/lib/adsdk.js"></script> <meta charset="utf-8" name="ad.size" content="width=320,height=268"> <title>320x268_YandexVideo</title> <!-- write your code here --> <script> function getUrlParam(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^]*)"), results = regex.exec(location.search); return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } </script> <style> body { margin:0px; height: 100%; } #video { border: 1px solid gray; width: 100% !important; height: 100% !important; min-width: 320px; max-width: 1080px; min-height: 268px; max-height: 328px; object-fit: contain; position: fixed; margin: auto; left:0;right:0;bottom:0;top:0; display: block; background-color:rgba(00, 00, 00, 1.0); } </style> </head> <body onload="init();"> <script> var video = document.getElementById('video'); video.addEventListener('canplaythrough', function() { // Do something. this.play(); }); video.src = getUrlParam('video1'); document.getElementById("click1_area").href = getUrlParam('link1'); home.expandableBannerAPI.close(); </script> <a id="click1_area" href="#" target="_blank" style="width: 100%; height: 100%; cursor: pointer; position: absolute; z-index: 9;"> <video id="video" width="400" height="224" controls> <!--<source src="video_for_banner.mp4" type="video/mp4">--> </video> </a> </body> </html> -
I tried, and it does not work.
Locally it is running with this<video id="video" width="400" height="224" controls> <source src="video_for_banner.mp4" type="video/mp4"> </video>And if i commented it — video1 not working, the player is empty.Video does not load, and clicktag works. -
Thank you for your answer!
It is right?To be honest, I'm sure that I did not properly)<!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://awaps.yandex.net/data/lib/adsdk.js"></script> <meta charset="utf-8" name="ad.size" content="width=320,height=268"> <title>320x268_YandexVideo</title> <!-- write your code here --> <script> function getUrlParam(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^]*)"), results = regex.exec(location.search); return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } var video = document.getElementById('video'); video.addEventListener('canplaythrough', function() { // Do something. this.play(); }); video.src = getUrlParam('video1'); </script> <style> body { margin:0px; height: 100%; } #video { border: 1px solid gray; width: 100% !important; height: 100% !important; min-width: 320px; max-width: 1080px; min-height: 268px; max-height: 328px; object-fit: contain; position: fixed; margin: auto; left:0;right:0;bottom:0;top:0; display: block; background-color:rgba(00, 00, 00, 1.0); } </style> </head> <body onload="init();"> <a id="click1_area" href="#" target="_blank" style="width: 100%; height: 100%; cursor: pointer; position: absolute; z-index: 9;"> <video id="video" width="400" height="224" controls> <source src="video_for_banner.mp4" type="video/mp4"> </video> </a> <script> document.getElementById("click1_area").href = getUrlParam('link1'); home.expandableBannerAPI.close(); </script> </body> </html> -
With your help, I made a html code that works correctly. I hope so. Everything works locally on my computer. But I do not understand how to implement video downloads by variable. They are asked to do so:
Appeal to the video should be on the parameter URL videoN starts from 1
var video = getUrlParam('video1');Where getUrlParam realized as in the requirements above for HTML5.This is the code that I have now:
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="https://awaps.yandex.net/data/lib/adsdk.js"></script> <meta charset="utf-8" name="ad.size" content="width=320,height=268"> <title>320x268_YandexVideo</title> <!-- write your code here --> <script> function getUrlParam(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^]*)"), results = regex.exec(location.search); return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } </script> <style> body { margin:0px; height: 100%; } #canvas { border: 1px solid gray; width: 100% !important; height: 100% !important; min-width: 320px; max-width: 1080px; min-height: 268px; max-height: 328px; object-fit: contain; position: fixed; margin: auto; left:0;right:0;bottom:0;top:0; display: block; background-color:rgba(00, 00, 00, 1.0); } </style> </head> <body onload="init();"> <a id="click1_area" href="#" target="_blank" style="width: 100%; height: 100%; cursor: pointer; position: absolute; z-index: 9;"> <video id="canvas" width="400" height="224" controls> <source src="video_for_banner.mp4" type="video/mp4"> </video> </a> <script> document.getElementById("click1_area").href = getUrlParam('link1'); home.expandableBannerAPI.close(); </script> </body> </html>I would be very grateful if you tell me how to realize what they are asking for!
-
It's bedtime for me here, let's see if someone who has experience with Animate will chime in, otherwise, I'll whip something up as an example at some point tomorrow.
Does that sound ok?
Yes, thanks a lot!
Try this blog post.
http://inflagrantedelicto.memoryspiral.com/2016/02/responsive-scaling-in-animate-cc/
Also ad platform is very important to know. Many of the ad vendors have templates for specific high impact ads. I don't see that size listed on Yandex.
Thank you! I remember this article, I will try to study it in more detail tomorrow.
This ad format new for Yandex, they start it only one week ago. No examples ( There is only what I wrote at the beginning of this topic and your link to html5 requirements.
-
Thanks! If it can be done with Animate it will be great. If not - I'll try to understand how it works. It's new ad format for mobile version of Yandex.
-
Thank you for your answer!
I forgot to say that I am a complete newbie in html, mostly I am a designer. I do everything in Adobe Animate + GS. But now it's a more complex task for me. Maybe for you guys it sounds funny, but for me it's a real challenge
Maybe there is a little example that I could see and repeat it?Thank you for understanding! -
Hi guys!Your community is awesome! I often read this forum but now I can not find an answer to my question.I need to make a responsive banner that stretches vertically and horizontally within certain limits (320x268 -> 1080x328). Inside this responsive container must play video.Advertising requirements are as follows:Transitions in the banner must use the value of the parameter linkN from get parameters of URL to the HTML-document as follows: for the first click link1, link2 for the second, etc. You can use the following code:
<script> function getUrlParam(name) { name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]"); var regex = new RegExp("[\\?&]" + name + "=([^]*)"), results = regex.exec(location.search); return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " ")); } </script> <a id="click1_area" href="#" target="_blank">...</a> <a id="click2_area" href="#" target="_blank">...</a> <a id="click3_area" href="#" target="_blank">...</a> // After "<a href ...></a>" assign them to click handlers: <script> document.getElementById("click1_area").href = getUrlParam('link1'); document.getElementById("click2_area").href = getUrlParam('link2'); document.getElementById("click3_area").href = getUrlParam('link3'); </script>For Video:
Appeal to the video should be on the parameter URL videoN starts from 1
var video = getUrlParam('video1');Where getUrlParam realized as in the requirements above for HTML5.Starting the video should only happen by pressing the "Play" button.Should displays information about the weight of the video (Mb).There should be a mute button.Thank you guys for any help!
adobe animate cc 2017 responsive banner
in Banner Animation
Posted
Hi guys!
Is it possible to find an example of a responsive banner that I can make in Adobe Animate 2017?
All my old source files that worked a year ago do not work now and my skills are not enough to understand what has changed, I just see that the code that generates Animate just diferent.
The banner should stretch the entire length of the page, have a minimum width (for example 800 px), and inside there should be 3 independent moveclips - "left", "central" and "right", which change their position depending on the width of the banner.
Thanks for any help!