Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
HTML
<link rel="stylesheet" href="/digital-building-blocks/sites/download/attachments/584712272/suc-sto-det-ftr.css?api=v2">
Div
classsection ss-introduction
Div
classcontainer
Div
classcols
Div
classcol-4
Html-bobswift
<p><span class="ss-introduction-label">EBSI’s success stories</span></p>
<h1>Transcript of Records</h1>
<ul class="list-flag"> 
<li><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/flag-belgium.svg" alt="Belgium Flag"></li>
<li><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/flag-spain.svg" alt="Spain Flag"></li>
<li><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/flag-italy.svg" alt="Italy Flag"></li> 
<li aria-hidden="true" class="list-flag-separator"><span></span></li> 
<li><img src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/468026266/flag-european-union.svg" alt="European Union Flag"></li>
</ul> 
Div
classcol-5

A student gets a master diploma after receiving a transcript of records validated by Erasmus

Div
classss-cta-banner
Div
classcontainer
Div
classcols
Div
classtext-center
Html-bobswift
<h2 class="h3">Interested to join the use cases development with EBSI?</h2> 
<a class="btn secondary anchor-smooth-scroll" href="#ss-cta-register"><span>Register><span>Apply now</span><span class="ico-cta"></span></a> 

...

Div
classsection ss-video
Div
classcontainer
Div
classcols
Div
Html-bobswift
<h2 class="heading-deco terciary">Watch the demo</h2>
Div
classcols justify-content-center
Div
classcol-8
Html-bobswift
<div id="tabs-video-content">

<div id="tab1" class="tab-video-content">
<div class="tabs-video-content-iframe">
<iframe src="https://europa.eu/webtools/crs/iframe/?addconsent=youtube.com&oriurl=https%3A%2F%2Fwwwhttps://www.youtube.com%2fembed%2fDPqVnnpVhzU" allowfullscreen="" width="100%" height="315" frameborder="0"></iframe>
</div>
</div>

<div id="tab2" class="tab-video-content">
<div class="tabs-video-content-iframe">
<iframe src="https://europa.eu/webtools/crs/iframe/?addconsent=youtube.com&oriurl=https%3A%2F%2Fwwwhttps://www.youtube.com%2fembed%2fCp_NFex_5pQ" allowfullscreen="" width="100%" height="315" frameborder="0"></iframe>
</div>
</div>

<div id="tab3" class="tab-video-content">
<div class="tabs-video-content-iframe">
<iframe src="https://europa.eu/webtools/crs/iframe/?addconsent=youtube.com&oriurl=https%3A%2F%2Fwwwhttps://www.youtube.com%2fembed%2fBoGGCJj3CLI" allowfullscreen="" width="100%" height="315" frameborder="0"></iframe>
</div>
</div>

<div id="tab4" class="tab-video-content">
<div class="tabs-video-content-iframe">
<iframe src="https://europa.eu/webtools/crs/iframe/?addconsent=youtube.com&oriurl=https%3A%2F%2Fwwwhttps://www.youtube.com%2fembed%2fJNnmJH6Oaao" allowfullscreen="" width="100%" height="315" frameborder="0"></iframe>
</div>
</div>  

</div>      
Div
classcols
Div
Html-bobswift
<ul id="tabs-video-nav">
  <li><a href="#tab1"><span class="cover-play"><img class="cover-img" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/584712270/img-ss-video-cover.png" alt="EBSI logo"></span><span class="cover-text">Short Demo Story 1</span></a></li>
  <li><a href="#tab2"><span class="cover-play"><img class="cover-img" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/584712270/img-ss-video-cover-02.jpg" alt="EBSI logo"></span><span class="cover-text">Interview of Actors</span></a></li>
  <li><a href="#tab3"><span class="cover-play"><img class="cover-img" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/584712270/img-ss-video-cover-03.jpg" alt="EBSI logo"></span><span class="cover-text">Full Demo</span></a></li>
  <li><a href="#tab4"><span class="cover-play"><img class="cover-img" src="https://ec.europa.eu/digital-building-blocks/sites/download/attachments/584712270/img-ss-video-cover-04.PNG" alt="EBSI logo"></span><span class="cover-text">Scenario</span></a></li>
</ul>
<script>
let listOfVideos = document.querySelector("#tabs-video-nav");
Array.from(listOfVideos.children).forEach((li, indexList) => { li.addEventListener("click", function(e) { $("iframe").each(function(index) { if(index != indexList) {
    var src = $(this).attr('src');
    $(this).attr('src', src);}});})})
</script>

Excerpt Include
Success stories detail footer
Success stories detail footer
nopaneltrue

HTML
<style>
CSS Stylesheet
/*---SECTION SS DETAIL INTRODUCTION---*/
.ss-introduction { background-image: url("https://ec.europa.eu/digital-building-blocks/sites/download/attachments/584712270/img-ss-introduction-erasmus-records.jpg");}
</style>