eCila

[Jquery / 스크립트] Fullwidth Audio Player 본문

디자인/다지인 소스자료(유료)

[Jquery / 스크립트] Fullwidth Audio Player

t@k1ng 2011. 11. 22. 15:59



데모

스크린샷



 
설명
This audio player is supported by all major browsers (Firefox, Chrome, Safari, IE7 -9, Opera etc.) and mobile devices like iPhone, iPad, Android etc.. It comes with a lot of Options and a great API .
One of the greatest feature is that all graphics are created with HTML5 canvas and for those browsers which do not support HTML5 canvas, a SVG fallback will be used. That means for you, you do not need to edit any image files to customize the colors by your wishes – just set the color values in the options of the plugin.
Your visitors can also share each of your tracks on facebook or twitter. The player also detects when you add a track and a track with a same title in the playlist already exists, then the already added track will be selected and starts playing.


Features
  • MP3 /Soundcloud Player in Flash/HTMl5
    Supports HTML and XML Playlists
    Keyboard Navigation
    Auto-Cover-Replacement
    Unlimited color variation, no image files are used
    Share your tracks on Facebook and Twitter
    A lot of options and a great API

 
Options
  • wrapperPosition – top or bottom
    mainPosition – left, center or right
    wrapperColor – background color of the wrapper
    mainColor – color for the graphics and other elements
    fillColor – background fill color of all graphics
    metaColor – color for some graphics and meta text
    strokeColor – color of all strokes
    fillColorHover – background fill color when you move your mouse over it
    activeTrackColor – background color for the current selected item in the playlist
    soundcloudKey – your own API key to use soundcloud
    twitterText – twitter text
    facebookText – facebook text
    soundcloudText – soundcloud text
    height – the height of the wrapper
    playlistHeight – the playlist height
    coverSize – size (x,y) of the cover
    offset – the offset between playlist and upper content
    opened – open player by default
    volume – show/hide volume bar
    playlist – show/hide playlist
    autoLoad – loads the music file when soundmanager is ready
    autoPlay – enable/disbale autoplay
    playNextWhenFinished – plays the next track when current one has finished
    keyboard – enable/disable the keyboard shortcuts
    socials – show/hide social links
    xmlPath – path to XML file, when you would like to manage your tracks via it
    xmlPlaylist – ID of the playlist which should be loaded into player from the XML file
    onReady – a function that will be called when player has been built

API
  • $.fullwidthAudioPlayer.play();
    $.fullwidthAudioPlayer.pause();
    $.fullwidthAudioPlayer.toggle();
    $.fullwidthAudioPlayer.previous();
    $.fullwidthAudioPlayer.next();
    $.fullwidthAudioPlayer.volume(0-1)
    $.fullwidthAudioPlayer.addTrack(trackUrl, title, meta, cover, linkUrl, playIt)
    $.fullwidthAudioPlayer.clear();


다운로드