Music on the jquery slide

0

I have a slideshow, I'm trying to get every id content div to play the music in the div content. I was thinking of using an if ($ ("# Content1"). Is (": visible") {$ ('# 1.mp3'). Play ();} But I looked on the net how to do this but did not find anything like it :( Thank you so much guys. Stackoverflow SHOOWWW! :) Note: Code below is playing the 2 songs together.

<div class="slide">
    <div class="content-switcher" id="Content1">
        <img src="imagem"/>
                <span class="pe-7s-volume">
                    <audio id="playTune" autoplay>
                        <source src="2.mp3">
                    </audio>
                </span>
        </div> 
    </div>

    <div class="content-switcher" id="Content2">
        <img src="img/2botao.jpg" style="height:100%;" />
                <span class="pe-7s-volume">
                    <audio id="playTune" autoplay>
                        <source src="1.mp3">
                    </audio>
                </span>           
    </div>
</div>
    
asked by anonymous 12.12.2016 / 14:21

1 answer

1

Does something solve your problem?

$(window).load(function() {
  $("#showContent1").click(function() {    
    showContent("Content1")
  })

  function showContent(id) {
    if (!$("#" + id).is(':visible')) {
      $("#Content1").show()
      $("#" + id + " audio")[0].play()
    } else {
      $("#" + id).hide()
      
    }
  }


})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonid="showContent1">show content1</button>
<div class="slide">
  <div class="content-switcher" style="display:none" id="Content1">
    <img src="imagem" />
    <span class="pe-7s-volume">
                                    <audio controls="">
  <source src="http://www.w3schools.com/html/horse.ogg"type="audio/ogg">
  <source src="http://www.w3schools.com/html/horse.mp3"type="audio/mpeg">
Your browser does not support the audio element.
</audio>
                </span>
  </div>
</div>

<div class="content-switcher" id="Content2">
  <img src="img/2botao.jpg" style="height:100%;" />
  <span class="pe-7s-volume">
                  <audio controls="">
  <source src="http://www.w3schools.com/html/horse.ogg"type="audio/ogg">
  <source src="http://www.w3schools.com/html/horse.mp3"type="audio/mpeg">
Your browser does not support the audio element.
</audio>
                </span> 
</div>
</div>
    
12.12.2016 / 15:06