Internet Commerce
Developer ChannelFlashKit.com
JavaScriptSource Developer Jobs ScriptSearch WebDeveloper.com Webreference HTMLGoodies HTML5 Dev Center Developer.com jGuru.com PHPBuilder
|
  Tutorials HomeWhat's NewTop RatedSubmitmyTutesRandom!
Search Tutorials
 Tutorials » Interactivity
Making the CDs draggablePlace your button on the stage in the main timeline on the layer named "cd1", then press F8 on your keyboard to turn this into a new Movie Clip symbol. I named mine cd_mc1. You're going to end up with several of these depending on how many songs you want, so be sure to include a number for reference. (Don't jump the gun and create a bunch of these clips for your different songs yet - you'll duplicate it later and modify the code you're about to insert). Next create your CD player artwork and convert it into a movie clip named "player". Place this on the stage in the layer named "player" and make sure to name the instance "player" in the Instance panel. This will be your drop target. I went one level further to make my drag-and-drop interaction more specific and added another nested movie clip named "tray" within the "player" movie clip, naming its instance what else? - "tray". Now go back and click on cd_mc1 and add the following Actionscript in the Object Actions panel:
onClipEvent (load) {
var orgX1 = _x;
var orgY1 = _y;
}
Now double-click on the movie clip to edit in place. Click on your embedded CD button and add the following to the Object Actions panel: on (press) {
this.startDrag(false);
}
on (release) {
this.stopDrag();
if (eval(this._droptarget) == eval("/player/tray")) {
unloadMovieNum (12);
loadMovie ("volume1.swf", 12);
_root.cdText = "Song Name";
_x = orgX1;
_y = orgY1;
}
else if (eval(this._droptarget) != eval("/player/tray")){
_x = orgX1;
_y = orgY1;
}
}
Within the "on(press)" action you start your drag function and set its variables. You can learn more details about this in other tutorials on this site. Next in the "on(release)" action we set the actual drop target area by indicating the complete path to the movie clip we want (/player/tray). Then we load our first volume slider with the loadMovie action - we'll get to creating those momentarily. You can set it to load on whatever level you want, I just put mine really high to keep out of the way of anything else loading on the site. The "unloadMovieNum (12)" removes any previous song that was loaded there. "_root.cdText = "Song Name" puts the name of the song in our dynamic text box on the main movie timeline (and no, don't literally use "Song Name", put the actual artist and title of the song you attach). The _x and _y properties make it snap back after the CD been dropped, in this case whether you hit the drop target or not. (cont.)
|
||||||||||||||||||||||||||||||||||||||||||||||||
 |
|||||||||||||||||||||||||||||||||||||||||||||||||
Virtual CD Player with ActionScript!
|
 |
 |
|