sub-animals.html

<!-- i-C-a -->
<div data-role="page" id="animals2">
  <div data-role="content" style="overflow:hidden !important;">
    
    <div id="titleb-holder"><h1 style="margin-top:184px;">Animals</h1></div>
    
    <div style="width:90%;margin:auto;">
      <div class="aclink"><a href="#" data-transition="slide" id="agmovielink"><img src="css/images/9-12/Animals/aoabtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/bigcatsbtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/minibeastsbtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/farmabtn.png"></a></div><br>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/bandbbtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/dinootsbtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/raptorsbtn.png"></a></div>
      <div class="aclink"><a href="#" data-transition="slide"><img src="css/images/9-12/Animals/livingwhbtn.png"></a></div>
    </div>
    
    <div class="botlogoholder"><a href="home.html" class="homelinkbh"><img src="css/images/9-12/bottomhome.png"></a></div>
  </div> <!-- end content -->  
    <script>
				$(function() {
					$("#animals2").swipe( { swipeRight:goBack, allowPageScroll:"auto"} );
				});
        
    function goBack() {
      $.mobile.changePage("home.html");
      animalsoundbg.pause();animalsoundbg.currentTime = 0;
      mainaudiobg.play();
    }
    
    $('.homelinkbh').on('tap', function() { 
      mainaudiobg.play(); animalsoundbg.pause(); animalsoundbg.currentTime = 0;
    });
			</script>
</div>