I used a wonderful resource at oreillynet to grab a pretty nice script to open up mp2's in a little .js pop up window. I'm just having a little issue trying to get the link color to change. I see where the code is and have tried several reditions. Just not accomplishing getting the link customized to match rest of site.
Here is site for example test audio pop up
Only first audio link "All Right" is working right now to test...
disclaimer: I know the site is graphic heavy and not perfect by any means, but i'm learning here :0)
Down the line i would like to actually get rid of the fact that this opens the default player for system and actually really have more control over look and feel, but this will work for now.
This is the external file as a .js
// Pop-Up Embedder Script by David Battino, www.batmosphere.com
// Version 2006-05-31
// OK to use if this notice is included
function BatmoAudioPop(filedesc,filepath,WindowNumber)
{
// Get Operating System
var isWin = navigator.userAgent.toLowerCase().indexOf("windows") != -1
if (isWin) {
// Use MIME type = "application/x-mplayer2";
visitorOS="Windows";
} else {
// Use MIME type = "audio/mpeg"; // or audio/x-wav or audio/x-ms-wma, etc.
visitorOS="Other";
}
// Get the MIME type of the audio file from its extension (for non-Windows browsers)
var mimeType = "audio/mpeg"; // assume MP3/M3U
var objTypeTag = "application/x-mplayer2"; // The Windows MIME type to load the WMP plug-in in Firefox, etc.
var theExtension = filepath.substr(filepath.lastIndexOf('.')+1, 3); // truncates .aiff to aif
if (theExtension.toLowerCase() == "wav") { mimeType = "audio/x-wav"};
if (theExtension.toLowerCase() == "aif") { mimeType = "audio/x-aiff"};
if (theExtension.toLowerCase() == "wma") { mimeType = "audio/x-ms-wma"};
if (theExtension.toLowerCase() == "mid") { mimeType = "audio/mid"};
// Add additional MIME types as desired
if (visitorOS != "Windows") {
objTypeTag = mimeType; // audio/mpeg, audio/x-wav, audio/x-ms-wma, etc.
};
PlayerWin = window.open('',WindowNumber,'width=320,height=217,top=0, left=0,screenX=0,screenY=0,resizable=0,scrollbars=0,titlebar=0,toolbar=0,menubar=0,status=0,directories=0');
PlayerWin.focus();
PlayerWin.document.writeln("<html><head><title>" + filedesc + "</title></head>");
PlayerWin.document.writeln("<body bgcolor='#333333'; text='#FFFFFF'; font-family='verdana, geneva, san-serif'; background='images/player_background.jpg'>"); // specify background img if desired
PlayerWin.document.writeln("<div align='center'>");
PlayerWin.document.writeln("<b style ='font-size:14px;font-family:verdana, geneva, san-serif;line-height:1.6;background:#333333'>" + filedesc + "</b><br />");
PlayerWin.document.writeln("<object width='280' height='69'>");
PlayerWin.document.writeln("<param name='src' value='" + filepath + "'>");
PlayerWin.document.writeln("<param name='type' value='" + objTypeTag + "'>");
PlayerWin.document.writeln("<param name='autostart' value='1'>");
PlayerWin.document.writeln("<param name='showcontrols' value='1'>");
PlayerWin.document.writeln("<param name='showstatusbar' value='1'>");
PlayerWin.document.writeln("<embed src ='" + filepath + "' type='" + objTypeTag + "' autoplay='true' width='280' height='69' controller='1' showstatusbar='1' bgcolor='#7e7243' kioskmode='true'>");
PlayerWin.document.writeln("</embed></object></div>");
PlayerWin.document.writeln("<p style='font-size:12px;color:#FFFFFF; font-family:Verdana, Geneva, sans-serif; text-align:center'><a href='" + filepath +"'>download</a> <span style='font-size:10px'>(right-click or Control-click)</span></p>");
PlayerWin.document.writeln("<form><div align='center'><input type='button' value='close' onclick='javascript:window.close();'></div></form>");
PlayerWin.document.writeln("</body></html>");
PlayerWin.document.close(); // "Finalizes" new window
}Highlighted in red is link area, not sure what to put in to get change from default link color and hover instances.
TIA - Johnny