Witam Was,

mam taki problem, tworzę audio player w HTML5 z użyciem tagu <audio> i mam stworzony pasek, który, chciałbym przesuwać muzykę.

Pasek jest rysowany w canvas:

<canvas id="canvas" width="260" height="3">Canvas HTML5 nie jest obsługiwany</canvas>

Teraz mam pytanie, w jaki sposób napisać funkcje w JS która pobiera współrzędne kursowa i wyświetla pozycje w poziomie.

Musisz obsłużyc kilka zdarzeń JS i na ich podstawie wyświetlać suwak przesunięty o jakiś tam offset. Po pierwsze musisz wiedzieć czy użytkownik wcisnął przycisk myszy w obszarze działania suwaka.

[JAVASCRIPT] pobierz, plaintext 
var move = false
$('#canvas').mousedown(function(){
  //wyliczasz gdzie zapoczątkowano przeciaganie 
  //i czy punkt startu znajduje się w obszarze działania suwaka,
  // jeśli tak, ustawiasz flagę 'move' na true
})
[JAVASCRIPT] pobierz, plaintext 

Druga rzecz to obsługa przesuwania myszki gdy wciśnięty jest jej klawisz.

[JAVASCRIPT] pobierz, plaintext 
$('#canvas').mousemove(function(e){
  if (!move) return false; // wychodzimy z funkcji jeśli move == false
  var x = e.clientX; //pozycja myszki względem krawędzi okna
  var y = e.clientY;
  var of = $(this).offset(); //obiekt z przesunięciem elementu canvas względem krawędzi okna
  // wyliczasz z tego gdzie masz wyświetlić suwak
})
[JAVASCRIPT] pobierz, plaintext 

I to cała filozofia

Do wyłapywania eventów użyłem jQuery, możesz to samo zrobić w gołym JS.