AnsweredAssumed Answered

Seeking help for audio in Map Journal Story Map

Question asked by jkerski-esristaff Employee on Jun 30, 2017
Latest reply on Jul 26, 2017 by jkerski-esristaff

Hi Everyone:

 

My goal in making a story map right now is to play the AUDIO from some of my YouTube videos.  The code below works just fine - it links to a javascript file and the YouTube API accomplishes what I am seeking – Here is a sample page of how that works here: pixelright.com/joseph.htm  and below is the code that makes it work.

 

That’s all good and it works great!  … outside the story map.  But inside the story map, it looks like the graphic below ... it is not hyperlinked.  I feel I'm so close and just need to remove some of the DIV code but ... not sure what to change and I've tried it many times with many versions of the code below.  Thank you for any assistance!

 

This is what it looks like in the story map

 

CODE:

 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>jjk</title>
<style type="text/css">
<!--
body { margin: 0; padding: 0; }
#wrapper {
margin: 100px auto;
text-align: center;
}
#youtube-audio img { width: 50px; }
body {
background-color: #fff;
}
-->
</style></head>

<body>
<div id="wrapper">
<div>This is audio playing from the YouTube video here: https://www.youtube.com/watch?v=yTT3hPVoCoY</div>
<div align="center">
<div data-video="yTT3hPVoCoY"
data-autoplay="0"
data-loop="1"
allowfullscreen="false"
height="250"
width="400"
id="youtube-audio">
</div>
<script src="https://www.youtube.com/iframe_api"></script>
<script src="https://cdn.rawgit.com/labnol/files/master/yt.js"></script>
</div>
</div>
</body>
</html>

Outcomes