黃聰：原生js的音訊播放器，相容pc端和移動端（原創）
更新時間：2018/9/3 下午1:32:54
更新說明：新增音樂的loop設定和ended事件監聽
loop為ture的時候不執行ended事件
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
const wx = new WxAudio({
ele: '.wx-audio',
title: '河山大好',
disc: '許嵩',
src: '。。。。',
width: '320px',
loop: true,
ended: function() {
var src = '。。。。'
vartitle = '她說'
var disc = '林俊杰'
wx.audioCut(src, title, disc)
}
})
|
釋出時間：2018-4-4 1:01
wx-audio
微信公眾號音樂播放器
基於原生js寫的一款仿微信公眾號的音樂元件
例項化 音樂元件
| 1 2 3 4 5 6 7 |
var wxAudio = new Wxaudio({
ele: '#textaudio1',
title: '河山大好',
disc: '許嵩',
width: '320px'
});
|
方法
| 1 2 3 4 5 6 |
// 例項化的wxAudio可以這樣操作
wxAudio.audioPlay() // 播放
wxAudio.audioPause() // 暫停
wxAudio.audioPlayPause() // 播放暫停
wxAudio.showLoading(bool) //顯示載入狀態 引數bool
wxAudio的audioCut(src,title,disc) 實現音訊切換的效果
|
新增 音樂元件切歌方法
通過例項化的wxAudio的audioCut(src,title,disc) 實現音訊切換的效果 示例程式碼如下
| 1 2 3 4 |
var src = '.....mp3'
var title = '她說'
var disc = '林俊杰'
wxAudio.audioCut(src, title, disc)
|
相關推薦
黃聰：原生js的音訊播放器，相容pc端和移動端（原創）
更新時間：2018/9/3 下午1:32:54 更新說明：新增音樂的loop設定和ended事件監聽 loop為ture的時候不執行ended事件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 const wx
Wavesurfer.js音訊播放器外掛的使用教程
Wavesurfer.js是一款基於HTML5 canvas和Web Audio的音訊播放器外掛，本文主要記錄它及其視覺效果外掛Regions外掛的使用方法。 1、建立例項 引入外掛 import WaveSurfer from "wavesurfer.js"; 建立例項物件 t
iOS音訊播放 (六)：簡單的音訊播放器實現
在前幾篇中我分別講到了AudioSession、AudioFileStream、AudioFile、AudioQueue，這些類的功能已經涵蓋了第一篇中所提到的音訊播放所需要的步驟： 讀取MP3檔案 NSFileHandle解析取樣率、位元速率、時長等資訊，分離MP3中的音訊幀 AudioFileStr
推薦下：開源ckplayer 網頁播放器， 跨平臺(html5, mobile)，flv, f4v, mp4, rtmp協議. webm, ogg, m3u8 ！
網頁播放器 get ... 默認 control firefox ckplayer 原本 auto 視頻播放， 原本是想h5 自帶視頻播放，使用很簡單，結果現實很骨感。 <video controls="controls" preload="auto" height
HTML5做的音訊播放器，可以動態的更換音訊檔案的內容
在做一個播放按鈕時突然用到了這個技術，具體還是蠻簡單的，一看就會，就是那個音訊檔案的src屬性動態賦值的時候花了點時間。看程式碼吧！ function playOrPaused(obj) {
原生js日曆選擇器，學習js面向物件開發日曆外掛
在web開發過程中經常會碰到需要選擇日期的功能，一般的操作都是在文字框點選，然後彈出日曆選擇框，直接選擇日期就可以在文字框顯示選擇的日期。開發好之後給使用者使用是很方便，但如果每一個日曆選擇器都要臨時開發的話，會嚴重影響專案進度。所以網上有很多日曆外掛提供下載使用。 在實際工作中，日曆選擇器功能確實都是直接使
利用js自動檢測pc端和移動端，js程式碼，需要寫兩個網頁，一個pc，一個移動端
假設pc/index.html是pc端的網頁，mobile/index.html是移動端的網頁 在外部設定一個html進行判斷，分別跳轉； //判斷如果是pc端，自動跳到pc/index.html //安卓手機自動跳到mobile/
js實現一個可以相容PC端和移動端的div拖動效果
拖動時候用到的三個事件：mousedown、mousemove、mouseup在移動端都不起任何作用。 畢竟移動端是沒有滑鼠的，查資料後發現，在移動端與之相對應的分別是：touchstart、touc
Pc端和移動端拖拽元件jquery.drag.js
移動市場開始火爆以來，網頁上的拖拽效果則要做到全相容則不是一件易事，因此最近把研究成果奉上，供大家使用。 幾點宣告： 1.被拖拽的元素不要是超連結，因為阻止了預設事件，所以想讓元素內的超連結也開啟是不現實的，否則手工取消預設的阻止程式碼； 2.拖拽意味著該元素是絕對定位，非
js倒計時(天，時，分，秒)，適用於web和移動端
var obj;$('.countDown ul:first-child').show().siblings('ul').hide()var endTime='2017-4-14 17:05:00'; //設定一個結束時間//根據結束時間獲取到結束的 年，月，日，時，分，秒var end_year=endT
JS pc端和移動端共同實現復制到剪貼板功能實現
oct com put 而是 minimum size func char ror JS pc端和移動端實現復制到剪貼板功能實現 在網頁上復制文本到剪切板，一般是使用JS+Flash結合的方法，網上有很多相關文章介紹。隨著 HTML5 技術的發展，Flash 已經在很多場合
js中常用的事件（pc端和移動端）
1.點選事件： 在pc端是點選事件，但是在移動端是單擊事件，在移動端的專案中我們經常會區分單擊做什麼和雙擊做什麼，所以移動端的瀏覽器在識別click的時候，只有確定是單擊後才會把它執行，在移動端使用click會存在300ms的延遲:瀏覽器在第一次點選結束後，還需要等到300
黃聰：Jquery+DataTables插件，如何在ajax調用服務器數據後，自動給tr添加id屬性
jquer ida ted fnr pos sid idt 事件 all http://legacy.datatables.net/usage/callbacks#fnRowCallback 主要通過 fnCreatedRow 事件來實現 var table = $
黃聰：JS數學計算精度修正
function 浮點數 turn 計算 filesize add follow fun his 問題描述 如果我問你，4330.61乘以100等於多少，我猜你肯定跟我說：“肯定是 433061”啊！ 是啊，要我我也是這麽回答，來來來我們
OCiOS開發：音訊播放器 AVAudioPlayer
簡介 AVAudioPlayer音訊播放器可以提供簡單的音訊播放功能，其標頭檔案包含在AVFoudation.framework中。 AVAudioPlayer未提供視覺化介面，需要通過其提供的播放控制介面自行實現。 AVAudioPlayer僅能播放本地音
最簡單的基於FFMPEG+SDL的音訊播放器：拆分-解碼器和播放器
=====================================================最簡單的基於FFmpeg的音訊播放器系列文章列表：=====================================================本文補充記錄《
10個免費開源的JS音樂播放器插件
一個 很好 tle ef7 制作 obi tex ios開發者 選擇 音樂播放器在網頁設計中有時候會用到，比如一些時尚類、音樂或影視類等項目，但這些 網頁播放器 插件比較少見，所以這裏為大家整理一個集合，也許會有用到的時候。 下面整理的播放器有些是支持自適應的，如果需要
0510日重點：原生js修改豆瓣電影api 在angularjs裏運用出現的bug
http ava move var cti tps 上下 console date 用$http.jsonp調用豆瓣電影api，會出現返回數據格式錯誤的bug。在控制器裏加上下面的代碼，才能正常獲取到數據。 function jsonp(url, ca
黃聰：ffmpeg基本用法(轉)
sca wid cal ner aspect mp4 動態文本 tegra 控制輸出 FFmpeg FFmpeg 基本用法 本課要解決的問題 1.FFmpeg的轉碼流程是什麽？ 2.常見的視頻格式包含哪些內容嗎？ 3.如何把這些內容從視頻文件中抽取出來？ 4.如
黃聰：FFmpeg 使用指南
留下 時間 下一個 pseudo rdquo tle 全局 什麽 實時 1. ffmpeg 是什麽？ ffmpeg(命令行工具) 是一個快速的音視頻轉換工具。 2. ffmpeg 的使用方式 命令行： ffmpeg [全局選項] {[輸入文件選項] -i &lsquo