Reply to thread

Message: <blockquote data-quote="Lasanthajn" data-source="post: 24302893" data-attributes="member: 61219"><p>ටිකක් නෙට් එකේ ඇවිදිනකොට හිතුන මට ඕන විදියට Audio Player එකක් හදන්න ඒනෙ කියල.. ඇත්තටම අපිට ඕනෙ දැන ගන්න Photoshop විතරයි. ඉතුරු ටිකි html5, css, JavaScript වලින් කරගන්න පුළුවන්</p><p></p><p><img src="https://i.postimg.cc/tR50vbQD/Capture.jpg" alt="" class="fr-fic fr-dii fr-draggable " style="" /></p><p></p><p>[HTML]<div class="audio_player" id="ap"></p><p></p><p>  <div class="player_body"></p><p>    <div class="hamburger-menu"></p><p>      <div class="bar"></div></p><p>    </div></p><p>    </p><p>    <div class="nav_menu" id="navMenu"></p><p>      <div class="nav_list"></p><p>        <div class="nav_item"></p><p>          <p>Developed by:</p></p><p>          <a href="https://www.linkedin.com/in/vladislav-kubyshkin-b15b18128" target="_blank">Vladislav Kubyshkin</a></p><p>        </div></p><p>        <div class="nav_item"></p><p>          <p>Template designed by:</p></p><p>          <a href="https://dribbble.com/rezashintia" target="_blank">Reza Shintia Dewi</a></p><p>        </div></p><p>      </div></p><p>    </div></p><p>    </p><p>    <div class="player_playlist" id="pl_playlist"></p><p>      <ul class="player_playlist_list"></ul></p><p>    </div></p><p>    </p><p>    <div class="player_fade"></div></p><p>    <div class="player_content"></p><p>      <div class="player_header"></p><p>        <div class="container-fluid"></p><p>          <div class="row"></p><p>            <div class="col-xs-2"></p><p>              <div class="playlist_btn"><span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span></div></p><p>            </div></p><p>            <div class="col-xs-8"></p><p>              <div class="header_name text-center" id="nowPlay"></p><p>                <span id="npAction">PAUSED...</span></p><p>              </div></p><p>            </div></p><p>          </div></p><p>        </div></p><p>      </div></p><p>      </p><p>      <div class="album_wrap"></p><p>        <div class="default_cover"><div class="cover"></div></div></p><p>      </div></p><p>      </p><p>      <div class="song_playing text-center"></p><p>        <div class="title_block"><span id="title" title="">Hi Dribbble!</span></div></p><p>        <div class="artist_block"><span id="artist" title="">Reza Shintia Dewi</span></div></p><p>      </div></p><p>      </p><p>      <div class="timeline_wrap"></p><p></p><p>        <div class='timeline'></p><p>          <div class='full_line'></div></p><p>          <div class="line_preload"></div></p><p>          <div class='line_played'></p><p>            <span class='timeline_pointer'></span></p><p>          </div></p><p>        </div></p><p></p><p>        <div class="time_of_song"></p><p>          <div class="container-fluid"></p><p>            <div class="row"></p><p>              <div class="col-xs-2"></p><p>                <span class="time_played">0:00</span></p><p>              </div></p><p>              <div class="col-xs-2 col-xs-offset-8"></p><p>                <span class="full_time">0:00</span></p><p>              </div></p><p>            </div></p><p>          </div></p><p>        </div></p><p>      </div></p><p>      </p><p>      <div class="player_btns"></p><p>        <div class="container-fluid"></p><p>          <div class="row"></p><p>            <div class="col-xs-2"></p><p>              <div class="random_btn text-center btn_shadow" id="random"><span class="glyphicon glyphicon-random" aria-hidden="true"></span></div></p><p>            </div></p><p>            </p><p>            <div class="col-xs-2"></p><p>              <div class="prev_btn text-center btn_shadow" id="btnPrev" data-action='prev'><span class="glyphicon glyphicon-backward" aria-hidden="true"></span></div></p><p>            </div></p><p>            </p><p>            <div class="col-xs-3"></p><p>              <div class="play_btn text-center" id="play" data-action='play'></p><p>                <span class="glyphicon glyphicon-play" id="play_circle" aria-hidden="true"></span></p><p>              </div></p><p>            </div></p><p>            </p><p>            <div class="col-xs-2"></p><p>              <div class="next_btn text-center btn_shadow" id="btnNext" data-action='next'><span class="glyphicon glyphicon-forward" aria-hidden="true"></span></div></p><p>            </div></p><p>            </p><p>            <div class="col-xs-2"></p><p>              <div class="repeat_btn text-center btn_shadow" id="repeat"><span class="glyphicon glyphicon-retweet" aria-hidden="true"></span></div></p><p>            </div></p><p>          </div></p><p>        </div></p><p>      </div></p><p>    </div></p><p>    </p><p>    <div class="waves"></p><p>      <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 275 223.7" style="enable-background:new 0 0 275 223.7;" xml:space="preserve"></p><p>        <style type="text/css"></p><p>          .st0{fill:url(#SVGID_1_);}</p><p>          .st1{fill:url(#SVGID_2_);}</p><p>          .st2{fill:url(#SVGID_3_);}</p><p>        </style></p><p>        <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="137.5" y1="-19.8534" x2="137.5" y2="92.9036"></p><p>          <stop  offset="0.104" style="stop-color:#FF8FCF;stop-opacity:0"/></p><p>          <stop  offset="1" style="stop-color:#FF8FCF;stop-opacity:0.7"/></p><p>        </linearGradient></p><p>        <path class="st0" d="M258.3,68c-21.8-6.7-21.5-47.8-31-48.3c-15.4-0.9-26.7,107.3-47.7,108c-16.6,0.6-26.8-67-46.7-66.3</p><p>          c-14.7,0.5-20,37.9-31.3,37.3c-18.2-0.9-24-98.7-36-98.7C54.7,0,49.5,82,36,82.3C25.4,82.6,18,32.1,8.3,33C3.2,33.5,0.7,47.8,0,51.7</p><p>          v172h275v-158C270.3,67.9,265,70,258.3,68z"/></p><p>        <linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="137.5" y1="26.8924" x2="137.5" y2="179.8649"></p><p>          <stop  offset="0" style="stop-color:#33D4FA;stop-opacity:0"/></p><p>          <stop  offset="1" style="stop-color:#33D4FA;stop-opacity:0.7"/></p><p>        </linearGradient></p><p>        <path class="st1" d="M261.8,94.7c-19.3,3.2-28.2-24.1-48.5-24.3c-22.5-0.2-29.2,33.3-47.3,32.2c-24.6-1.5-32.5-64.7-52-64.2</p><p>          C98.1,38.8,92.6,81,77.3,80.8c-16.6-0.2-25.5-50.3-36-49C29.8,33.3,29.8,95.4,17,96.5c-4.7,0.4-7-7.8-17-9.8v137h275V87.4</p><p>          C271.7,90.5,267.5,93.7,261.8,94.7z"/></p><p>        <linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="137.5" y1="6.0051" x2="137.5" y2="144.9296"></p><p>          <stop  offset="3.960396e-02" style="stop-color:#33D4FA;stop-opacity:0"/></p><p>          <stop  offset="1" style="stop-color:#00B2FA"/></p><p>        </linearGradient></p><p>        <path class="st2" d="M275,223.7V87.8c-6.2,4.4-15.4,9.1-26,8.9c-29.2-0.7-36.9-39.1-61.2-38.7c-22.1,0.4-29.1,32.4-46,30.3</p><p>          c-22.8-2.8-26.7-63.5-42.2-63.7c-16.5-0.1-25.2,68.9-42,68.5c-13.7-0.3-22.4-46.7-32.5-45c-4.3,0.8-8.1,10.3-10.7,16.8</p><p>          C12.3,70.5,11.7,74.4,8,79c-2.7,3.4-5.8,5.4-8,6.7v138H275z"/></p><p>        </svg></p><p>    </div></p><p>  </div></p><p></div></p><p></p><p><div id="preloader"></p><p>  <div id="status"></p><p>     <div class="spinner"></p><p>      <div class="rect1"></div></p><p>      <div class="rect2"></div></p><p>      <div class="rect3"></div></p><p>      <div class="rect4"></div></p><p>      <div class="rect5"></div></p><p>    </div></p><p>  </div></p><p></div>[/HTML]</p></blockquote><p></p>

Verification: Hata thunen beduwama keeyada? (60 bedeema thuna)

Top Bottom