How do I change my button colors? Options

[friarblues]

Ok, here's my site: CLICK

Here's the script to my music jukebox: CLICK

EDIT: Ok, forget changing the colors of the buttons, how do I replace the buttons with my own personal graphic of a button?

[OneOfTheseDayz]

get a host like photobucket then make your graphic in a painter program host it copy the url insert it inb place of the current url

[friarblues]

I have a host and I have the buttons, but when I insert it in place of where the text is, the old button (the one you can see on my site now) sticks out underneath my new buttons (which are smaller buttons then what is currently there).

[*digital.fragrance*]

Could you please post the code that is currently in your looks and feel?

[Kenado]

You can't put pictures in it....

But I do know how to change the color of it.

Q. How do you change the colors of the drop down playlist?
A. Simple edit this code however you would like to.

CODE

<style type="text/css">
select{
color:#000000;
background-color:#FFFFFF;
font-family:arial;
font-size:10px;
}
input {
color:#000000;
background-color:#FFFFFF;
font-family:arial;
font-size:10px;
}
</style>

Q. How do you change the colors of the Juke Box Player?
A. Use this code. It lets you change the color in the player.

<!-- begin code provided by createblog.com --><br /><OBJECT ID="Player" height="0" width="0" CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6"><br /><PARAM NAME="uiMode" VALUE="invisible"><br /><PARAM NAME="Autostart" VALUE="False"><br /></object><br /><br /><FORM ID="form"><br /><br /><SELECT style="FONT-SIZE: 8pt; BACKGROUND:#000000; WIDTH: 300px; COLOR: #ffffff; font-face: arial;" ID="playlist" size="1"><br /><br /><!-- Add song info that appears in drop down list here --><br /><option value="0">SONG TITLE</option><br /><option value="1">SONG TITLE</option><br /><option value="2">SONG TITLE</option><br /><option value="3">SONG TITLE</option><br /><option value="4">SONG TITLE</option><br /><option value="5">SONG TITLE</option><br /></SELECT><br /><br /><BR><br /><br /><BUTTON style="background-color: #black;" ID="BackButton" onClick="Back(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;<<&nbsp;</FONT></BUTTON><br /><BUTTON style="background-color: #black;"  ID="PlayPauseButton" onClick="PlayPause(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;&nbsp;Play&nbsp;&nbsp;</FONT></BUTTON><br /><BUTTON style="background-color: #black;"  ID="NextButton" onClick="Next(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;>>&nbsp;</FONT></BUTTON>&nbsp;<br /><BUTTON style="background-color: black;" ID="StopButton" onclick="Stop();"><FONT color="#ffffff">Stop</FONT></BUTTON><br /><b><font size="3" color="#ffffff">Shuffle</font></b><INPUT TYPE=checkbox CHECKED ID="ShuffleSwitch" onclick="ToggleShuffle(this);" value="ON"><br /><br /></FORM><br /></CENTER><br /><comment ID="PlayHTML"><FONT color="#ffffff">&nbsp;&nbsp;Play&nbsp;&nbsp;</FONT></comment><br /><br /><comment ID="ShuffleOnHTML"><INPUT TYPE=checkbox CHECKED ID="ShuffleSwitch" onclick="ToggleShuffle(this);"></comment><br /><comment ID="ShuffleOffHTML"><INPUT TYPE=checkbox UNCHECKED ID="ShuffleSwitch" onclick="ToggleShuffle(this);"></comment><br /><script ID="Main" Language="JavaScript"><br /><br /> var songs = new Array();<br /><br /> //*******************************//<br /> //****** CHANGEABLE STUFF *******//<br /> //*******************************// <br /> <br /> var shuffle = true;  // false = shuffle off, true = shuffle on<br /><br /> var autoStart = true;   // false = autoStart off, true = autoStart on<br /> <br /> var numberTracks = true;  // true = place track number in front of list items, false = no track numbers<br /> <br /> // Add song URLs here (make sure it matches up with the order you have for song info, and urls need quotes):<br />songs[0]="SONG URL";<br />songs[1]="SONG URL";<br />songs[2]="SONG URL";<br />songs[3]="SONG URL";<br />songs[4]="SONG URL";<br />songs[5]="SONG URL";<br /><br /> <br /> //*******************************//<br /> //*******************************//<br /><br />// Initializations //<br />with (document){<br /> var length = forms['form'].playlist.length;<br /><br /> if(numberTracks){<br />  for (var i = 0; i < length; i++){<br />   forms['form'].playlist.options[i].innerHTML = (i+1) + " - " + forms['form'].playlist.options[i].innerHTML;<br />  }<br /> }<br /> <br /> if (shuffle) {<br />  var randsg = Math.floor(Math.random()*songs.length);<br />  Player.url = songs[randsg];<br />  forms['form'].playlist.options[randsg].selected = true;<br />  forms['form'].ShuffleSwitch.outerHTML = ShuffleOnHTML.innerHTML;<br /> }<br /><br /> else {<br />  forms['form'].ShuffleSwitch.outerHTML = ShuffleOffHTML.innerHTML;<br />  Player.url = songs[0];<br /> }<br /><br /> if(autoStart){<br />  var snum = forms['form'].playlist.selectedIndex;<br />  if(Player.url != songs[snum]){<br />   Player.url = songs[snum];<br />  }<br />  Player.controls.Play();<br /> }<br />}<br /><br />// Functions //<br />// Discription: "PlayPause" will toggle playing and pausing if the same song is still selected,<br />//              otherwise it will load the newly selected song<br />function PlayPause(list) {<br /> var snum = list.selectedIndex;<br /> <br /> if((Player.url == songs[snum] && Player.url != "") && Player.playState != 1){<br />  if(Player.playState == 3){<br />   Player.controls.Pause();<br />  }<br />  <br />  else {<br />   Player.controls.Play();<br />  }<br /> }<br /><br /> else {<br />  Player.url = songs[snum];<br />  Player.controls.Play();<br /> }<br />}<br /><br />// Discription: "Next" will move to the next music file if shuffle is off<br />//              otherwise it will load a random song. Calls PlayPause to start music.<br />function Next(list) {<br /> var snum = list.selectedIndex;<br /> if (!shuffle) {<br />  if (snum == list.length-1) {<br />   snum = -1;<br />  }<br />  snum++;<br /> }<br /> <br /> else {<br />  var temp;<br />  do{<br />   temp = Math.floor(Math.random()*songs.length);<br />  } while(temp == snum);<br />  snum = temp;<br /> }<br /> <br /> list.options[snum].selected = true;<br /> PlayPause(list);<br />}<br /><br />// Discription: "Back" does the same thing as "Next" but moves backwads<br />//              through the list. If shuffle is on then picks a random song.<br />function Back(list) {<br /> var snum = list.selectedIndex;<br /> if (!shuffle) {<br />  if (snum == 0){<br />   snum = list.length;<br />  }<br />  snum--;<br /> }<br /> <br /> else {<br />  var temp;<br />  do{<br />   temp = Math.floor(Math.random()*songs.length);<br />  } while(temp == snum);<br />  snum = temp;<br /> }<br /> <br /> list.options[snum].selected = true;<br /> PlayPause(list);<br />}<br /><br />// Discription: Self explanitory.<br />function Stop(){<br /> Player.controls.Stop();<br />}<br /><br />// Discription: Makes the shuffle flag the same as the status of the CheckBox<br />//    The status of the checkbox (true/false) indicates if the box is checked<br />function ToggleShuffle(CheckBox) {<br /> shuffle = CheckBox.status;<br />}<br /><br /></script><br /><br /><script ID="StateChangeHandler" Language =" JavaScript" For =" Player" Event = playStateChange(NewState)><br /><br />// Description: This is an interupt handler used to handle instances when the<br />//              state of the player changes to play or stop for example.<br /><br />//STATE.innerText = NewState;<br /><br />switch(NewState){<br /> case 8:  // Handles player after it just finishes playing through a song<br />  var num = document.forms['form'].playlist.selectedIndex;<br /> <br />  if (!shuffle){<br />   if(num == document.forms['form'].playlist.length-1){<br />    num = -1;<br />   }<br />  <br />   num++;<br />  }<br />  else {<br />   var temp;<br />   do{<br />    temp = Math.floor(Math.random()*songs.length);<br />   } while(temp == num);<br />   num = temp;<br />  }<br /> <br />  document.forms['form'].playlist.options[num].selected = true;<br /> <br />  PreviousState = NewState;<br />  break;<br /><br /> case 1: // Handles player after it stops<br />  if(PreviousState == 8){<br />   var num = document.forms['form'].playlist.selectedIndex;<br />   Player.settings.autoStart = true;<br />   Player.url = songs[num];<br />   PreviousState = NewState;<br />  }<br />  <br />  else if (PreviousState != 3 && PreviousState != 2){<br />   Player.controls.Play();<br />   Player.settings.autoStart = false;<br />  }<br />  <br />  else{<br />   forms['form'].PlayPauseButton.innerHTML = PlayHTML.innerHTML;<br />  }<br />  break;<br /><br /> case 3: // Handles player after it starts to play<br />  PreviousState = NewState;<br />  forms['form'].PlayPauseButton.innerHTML = "Pause";<br />  shuffle = document.forms['form'].ShuffleSwitch.status;<br />  break;<br /><br /> case 2: // Handles player after being paused<br />  PreviousState = NewState;<br />  forms['form'].PlayPauseButton.innerHTML = PlayHTML.innerHTML;<br />  break;<br /><br /> default:<br />}<br /><br /></script><br /><!-- end code provided by createblog.com -->

Q. What do I edit in that code to change the color?
A. This edits the color of the playlist.

CODE

<SELECT style="FONT-SIZE: 8pt; BACKGROUND:#000000; WIDTH: 300px; COLOR: #ffffff; font-face: arial;" ID="playlist" size="1">

This edits the color of the buttons.

CODE

<BUTTON style="background-color: #black;" ID="BackButton" onClick="Back(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;<<&nbsp;</FONT></BUTTON>
<BUTTON style="background-color: #black;"  ID="PlayPauseButton" onClick="PlayPause(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;&nbsp;Play&nbsp;&nbsp;</FONT></BUTTON>
<BUTTON style="background-color: #black;"  ID="NextButton" onClick="Next(forms['form'].playlist);"><FONT color="#ffffff">&nbsp;>>&nbsp;</FONT></BUTTON>&nbsp;
<BUTTON style="background-color: black;" ID="StopButton" onclick="Stop();"><FONT color="#ffffff">Stop</FONT></BUTTON>
<b><font size="3" color="#ffffff">Shuffle</font></b><INPUT TYPE=checkbox CHECKED ID="ShuffleSwitch" onclick="ToggleShuffle(this);" value="ON">

</FORM>
</CENTER>
<comment ID="PlayHTML"><FONT color="#ffffff">&nbsp;&nbsp;Play&nbsp;&nbsp;</FONT></comment>

Right in tha FAQ's section.