當前位置: 首頁>>編程示例 >>用法及示例精選 >>正文


p5.js MediaElement clearCues()用法及代碼示例

p5.j​​s庫的p5.MediaElement的clearCues()方法用於清除已使用addCue()方法調度的媒體元素的所有當前調度的提示。

用法:

clearCues()

參數:此函數不接受任何參數。

以下庫包含在HTML文件的“head”部分中,以使JavaScript函數起作用。

<script src=”p5.Image.js”></script>
<script src=”p5.min.js”></script>



例:以下示例說明了p5.js庫的clearCues()方法。

Javascript

function setup() { 
  createCanvas(550, 400); 
  textSize(18); 
  
  text("The events in addCue() are " + 
       "called according to the given time", 
       20, 20); 
  
  example_media = 
    createVideo("sample-video.mp4"); 
  example_media.size(426, 240); 
  example_media.position(20, 60); 
  
  example_media.speed(1.5); 
  example_media.showControls(); 
  
  rmvBtn =  
    createButton("Remove All Cues"); 
  rmvBtn.position(20, 320); 
  rmvBtn.mousePressed(removeCues) 
  
  
  // Using the addCue() method for scheduling 
  // the given callback functions 
  example_media.addCue(3, changeColor); 
  example_media.addCue(4, changeColor); 
  example_media.addCue(5, changeColor); 
  example_media.addCue(7, changeColor); 
} 
  
function removeCues() { 
  clear(); 
  
  // Remove all cues associated with 
  // the media element 
  example_media.clearCues(); 
  
  text("All cues removed!", 20, 360); 
  
  text("The clearCues() method removes " + 
       "all the current cues", 20, 20); 
} 
  
function changeColor() { 
  
  // Set a random background color 
  r = random(100, 200); 
  g = random(100, 200); 
  b = random(100, 200); 
  background(r, g, b); 
  
  text("Background Color Changed!", 
       20, 360); 
  
  text("The events in addCue() are " + 
       "called according to the given time", 
       20, 20); 
}

輸出:

在線編輯: https://editor.p5js.org/
環境設置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
參考:https://p5js.org/reference/#/p5.MediaElement/clearCues

相關用法


注:本文由純淨天空篩選整理自sayantanm19大神的英文原創作品 p5.js MediaElement clearCues() Method。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。