JQuery Audio Equalizer Animation in Asp.Net

          JQuery Audio Equalizer

Audio Equalizer Animation Using JQuery Plugins in Asp.Net.

                                       Demo
                                 
                     
                                Download

                              Html Coding


   <html lang="en">
       <head>
              <link rel="stylesheet" href="css/main.css" />
              <link rel="stylesheet" href="css/jquery.equalizer.css" />
       </head>
       <body>
             
              <section id="main_section" style="width:100%;height:100%;">
                    
                    
                     <div class="relative_left" style="width: 800px;margin: 30px 0px;height: 500px;left : 50%;margin-left: -300px;">
                           <h2 id="title">jQuery Audio Equalizer Animation </h2>

                           <p>
                                  <div class="song1 equalizer"></div>
                                  <audio controls loop id="song1">
                                         <source src="music/filec.mp3" >
                                  </audio>
                           <p>

                           <p>
                                  <div class="song2 equalizer"></div>
                                  <audio controls loop id="song2">
                                         <source src="music/file2.mp3" >
                                  </audio>
                           </p>
                          
              </div>
              </section>   

        <script src="js/jquery.min.js"></script>
              <script type="text/javascript" src="js/jquery.reverseorder.js"></script>
              <script type="text/javascript" src="js/jquery.equalizer.js"></script>
              <script>
                  $(document).ready(function () {
                      $('#song1').equalizer({
                          color: "#f2b400",
                          color1: '#a94442',
                          color2: '#f2b400',
                          //color3: '#000000'
                      });
                      $('#song2').equalizer();
                  });
              </script>
       </body>

</html>


Add New WebForm - Add Jquery Pluging Call to Audio source 

1 comment: