jQuery UI Music Player - Hit a Wall!

jQuery UI Music Player - Hit a Wall!

Hey there,
 
Has anyone else experienced any difficulties employing the jQuery Toolbar (media player buttons)?
 
I recently baught the jQuery Cookbook and hit a wall with 'Creating a jQuery UI Music Player'. I have the play/pause buttons working fine, and the audio plays as it should, but the 'current time' and 'duration' displays aren't executing, as well as the song position slider. I've checked, re-checked and double checked all my code, it's written as in the book.
 
The 'duration' display and the 'song position slider' aren't showing, and the 'current time' display doesn't update.
 
 
 
'Current' and 'Total Time' display code:
 
 
  1. function minAndSec(sec) {
       sec = parseInt(sec);
       return Math.floor(sec / 60) + ":" + (sec % 60 < 10 ? '0' : '') + Math.floor(sec % 60);
      }
      $('.mplayer .currenttime').text(minAndSec(audio.currentTime));
      $('.mplayer .duration').text(minAndSec(secondsTotal));
      
      $audio.bind('timeupdate', function(event) {
       $('.mplayer .currenttime').text(minAndSec(audio.currentTime));
       });








 
 
 
Slider track for song position code:
 
 
  1. $('.mplayer .track')
       .slider({
        range: 'min',
        max: audio.duration,
        slide: function(event, ui) {
         $('.ui-slider-handle', this).css('margin-left',
          (ui.value < 3) ? (1 - ui.value) + 'px' : '');
         if (ui.value >= 0 && ui.value <= audio.duration) {
          audio.set('currentTime', ui.value);
         }
        },
        change: function(event, ui) {
         $('.ui-slider-handle', this).css('margin-left',
          (ui.value < 3) ? (1 - ui.value) + 'px' : '');
        }
       })
       .find('.ui-slider-handle').css('margin-left', '0').end()
       .find('.ui-slider-range').addClass('ui-corner-left').end();
       
       $audio.bind('timeupdate', function(event) {
        $('.mplayer .track').each(function() {
         if ($(this).slider('value') != audio.currentTime) {
          $(this).slider('value', audio.currentTime);
         }
        });
        $('.mplayer .currenttime').text(minAndSec(audio.currentTime));
       });

























 
 
The CSS looks fine to me, so it must be something to do with the code. I've followed instructions, from the book, detailing how to set up jQuery UI on my page, so I'm confident it's not that either: plus, the play/pause buttons show fine and they're using images and styling from the downloaded theme I'm using for the player.
 
Any help will be greatly appreciated, and thank you in advance!
 
 
 
 
...Also, I just tried out the rest of the code for the music player, just to see if I could get anything else to work, but nope. May have been a bad idea, seeing as the problem may be generalised and not specific to a particular portion of the code, and therefore persist throughout the rest of the code.
 
Anyway, I'm using Dreamweaver CS5 for my coding, I copied and pasted the rest of code from the Cookbook website and Dreamweaver marked an error in the syntax concerning the volume control:
 
 
  1. start: function(event, ui) {
                            $(this).addClass('ui-slider-sliding');
                            $(this).parents('.ui-slider').css({
                                    'margin-top': (((1 - audio.volume) * −100) + 5) + 'px', // error on this line
                                    'height': '100px'
                            }).find('.ui-slider-range').show();




 
 
It highlighted the 'margin-top' line as the error. I have some idea why that could be, but I'm quite new to jQuery and JavaScript.
 
I hope someone can point me to a resolve, I really would like this to work. Everything was fine until I started putting in the code for the time displays.
 
Thank you!