Menu
Hi guys! This may sound confusing, but after a week of working on this project I am beat. I have an image, which is a mute button and when would like for the user to be able to click on it so it changes to another image. That I can do fine, but when the user clicks to unmute the image, I don’t know what logic to use. Here is what I have so far.
The same would apply to the play and pause images, but as of now I have them seperately.
[CODE]<HTML>
<HEAD>
<TITLE>Video Top Right</TITLE>
<meta name=”robots” content=”noindex”>
<!– #Include Virtual=”/_Videos/inc/Styles.inc” –>
<script src=”/_Videos/inc/slider.js” type=”text/javascript” language=”javascript1.2″></script>
<script language=”JavaScript”>
<!–
function moveFunction(sliderPosition) {
volSlider.setPosition(sliderPosition);
VIDEO.settings.volume = Math.round( 100 * sliderPosition );
}
function stopFunction(sliderPosition) {
volSlider.setPosition(sliderPosition);
}
function PlayVideo() {
VIDEO.controls.Play();
bPlayVideo = true;
}
function PauseVideo() {
VIDEO.controls.pause();
}
function MuteClick() {
VIDEO.settings.mute=(VIDEO.settings.mute ? false : true);
}
function fullScreen() {
VIDEO.fullScreen = ‘true’;
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf(“#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf(“?”))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//–>
</script>
</HEAD>
<BODY bgcolor=”#143064″ leftmargin=”0″ topmargin=”0″ rightmargin=”0″ bottommargin=”0″ >
<table align=”left” width=”350″ border=”0″ cellpadding=”0″ cellspacing=”0″>
<tr>
<td rowspan=”2″><img src=”/_Videos/images/VideoRight_1.gif” width=”10″ height=”285″></td>
<td><img src=”/_Videos/images/VideoRight_2.gif” width=”325″ height=”12″></td>
<td rowspan=”2″><img src=”/_Videos/images/VideoRight_3.gif” width=”15″ height=”285″></td>
</tr>
<tr>
<td align=”center” valign=”top” bgcolor=”f0f7ff”>
<% Call subPlayerObject(iVideoId, strFileName, VIRTUAL_VIDEO_PATH) %><br>
<table cellpadding=”2″ cellspacing=”1″ bgcolor=”#f0f7ff” border=”0″>
<tr>
<td align=”left” valign=”middle”>
<a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘play’,”,’/_Videos/images/ButtonPlay_Down.gif’,1)” onClick=”PlayVideo();”><img src=”/_Videos/images/ButtonPlay.gif” alt=”Play” name=”play” width=”25″ height=”17″ border=”0″></a>
<a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘pause’,”,’/_Videos/images/ButtonPause_Down.gif’,0)” onClick=”PauseVideo();”><img src=”/_Videos/images/ButtonPause.gif” alt=”Pause” name=”pause” width=”25″ height=”17″ border=”0″></a>
<a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘rewind’,”,’/_Videos/images/ButtonRW_Down.gif’,0)” onClick=”if(VIDEO.controls.isAvailable(‘FastReverse’)) VIDEO.controls.fastReverse();”><img src=”/_Videos/images/ButtonRW.gif” alt=”Rewind” name=”rewind” width=”22″ height=”17″ border=”0″></a>
<a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘fast_forward’,”,’/_Videos/images/ButtonFF_Down.gif’,0)” onClick=”if(VIDEO.controls.isAvailable(‘FastForward’)) VIDEO.controls.fastForward();”><img src=”/_Videos/images/ButtonFF.gif” alt=”Fast Forward” name=”fast_forward” width=”22″ height=”17″ border=”0″></a>
<a href=”#” onMouseOut=”MM_swapImgRestore()” onMouseOver=”MM_swapImage(‘fullscreen’,”,’/_Videos/images/ButtonFullscreen_Down.gif’,0)” onClick=”fullScreen();”><img src=”/_Videos/images/ButtonFullscreen.gif” alt=”Full Screen” name=”fullscreen” width=”75″ height=”17″ border=”0″></a>
<a href=”#” onClick=”MuteClick(); MM_swapImgRestore(); MM_swapImage(‘mute’,”,’/_Videos/images/ButtonMute_Down.gif’,0)”><img src=”/_Videos/images/ButtonMute.gif” alt=”Mute” id=”mute” name=”mute” width=”52″ height=”17″ border=”0″></a>
<img src=”/_Videos/images/VolumeIcon.gif” width=”15″ height=”15″ alt=”Volume” name=”Volume”>
</td>
<td valign=”middle”>
<script language=”JavaScript”>
<!–
var volSlider = new slider(
3, //height of track
40, //width of track
‘#143064’, //colour of track
0, //thickness of track border
‘#143064’, //colour of track border
4, //thickness of runner (in the middle of the track)
‘#143064’, //colour of runner
6, //height of button
10, //width of button
‘#c0c0c0’, //colour of button
1, //thickness of button border (shaded to give 3D effect)
‘<SPAN style=”font-size:6px;”></span>’, //text of button (if any)
true, //direction of travel (true = horizontal, false = vertical)
‘moveFunction’, //the name of the function to execute as the slider moves
‘stopFunction’, //the name of the function to execute when the slider stops
//the functions must have already been defined (or use null for none)
true
);
var DefaultPosition = 0.5;
volSlider.setPosition(DefaultPosition);
–>
</script>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan=”3″ background=”/_Videos/images/VideoRight_4.gif” valign=”top” width=”350″ height=”94″>
<table align=”center” width=”315″ cellpadding=”2″ cellspacing=”4″ border=”0″>
<tr>
<td class=”HeaderSmall” align=”center” valign=”top”>
<%= strVideoHeadline %><br>
</td>
</tr>
<tr>
<td class=”TextSmaller” align=”left” valign=”top”>
<%= strDescShort %>
<% If Trim(strDescLong) <> “” Then %>
<a class=”LinkSmall” title=”<%= strDescLong %>” href=”#” onclick=”window.open(‘/_Videos/VideoDescriptionLong.asp?video_id=<%= iVideoId %>’,’video_descr_long’,’menubar=no,location=no,toolbar=no,status=no,scrollbars=yes,resizable=no,width=400,height=600,top=30,left=5′); return false”>Read More…</a>
<% End If %>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan=”3″><br><p align=”center”><input type=”Button” value=”Close” onclick=”self.close()”></p></td>
</tr>
</table>
</BODY>
</HTML>
Any ideas or help would be much appreciated!