Questions about frames, gifs, midi: Do I use javascript?

Hi,

**Here's what I wanna do:**

(there are 3 frames)

1-  The user click on a link in frame 3.
2-  An image (animated gif) loads in frame 1.
3-  When the gif in frame 1 is loaded completely,
    a midi loads in frame 2.
4-  When the midi in frame 2 is over, a new gif loads in     frame 1.

I guess I'll have to use javascript to do that.  The problem is that I don't know javascript.  Is there a source on the web where I could find what I need?


Thanks,

Guillaume
lafranc@cam.org
http://www.cam.org/~lafranc
lafrancAsked:
Who is Participating?
 
Trevor013097Connect With a Mentor Commented:
Okay this is a long answer but it does what you want and works perfectly on a Javascript enabled browser.

It requires 1 page to setup and then the other 6 pages I have done are the first 3 pages which display simply 2 blanks and a START button.  The next 3 are the first image, the sound and then the second image.

The second image is loaded after a timeout as this is the only way of doing the load of the second image at the end of the midi file.  Insure that enough time is given to download and run the midi.

All references to images and sound should be replaced with your own file names.

Okay here are the pages.  All the pages are seperated by a filename strip.


<----------setup.html-------------->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<FRAMESET COLS="33%,34%,33%">
   <FRAME SRC="frame1.html" NAME="frame1">
   <FRAME SRC="frame2.html" NAME="frame2">
   <FRAME SRC="frame3.html" NAME="frame3">
</FRAMESET>
<NOFRAMES>
  <!-- Place text here that will be seen only by those browsers which do not support frames -->
</NOFRAMES>
</HTML>
<--------------end of setup.html------------>

<--------------frame1.html------------------>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY BGCOLOR="#FFFFFF">

This frame will display images

</BODY>
</HTML>
<--------------end of frame1.html------------->

<-------------frame2.html--------------->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY BGCOLOR="#FFFFFF">

This is where the sound is loaded and played.
</BODY>
</HTML>
<---------------end of frame2.html------------------>

<--------------frame3.html------------------>
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<SCRIPT LANGUAGE="Javascript">
<!--
function image1()
{
   
      parent.frame1.location = "frame1a.html";
}
</SCRIPT>

<BODY BGCOLOR="#FFFFFF">

<A HREF="" onclick="image1()">START</A>

</BODY>
</HTML>
<-------------------end of frame3.html---------------->

<-----------------frame1a.html------------------->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<SCRIPT LANGUAGE="Javascript">
<!--
function music()
{
   
      parent.frame2.location = "frame2a.html";
}
</SCRIPT>

<BODY BGCOLOR="#FFFFFF" onload="music()">

<IMG SRC="img0001.gif"><BR>

</BODY>
</HTML>
<----------------end of frame1a.html--------------->

<---------------frame2a.html--------------------->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<SCRIPT LANGUAGE="Javascript">
<!--
function PlaySound()
{

      window.location="music.mid"
image2()
}

function image2()
{
      setTimeout("parent.frame1.location = 'frame1b.html'", 5000);

}
</SCRIPT>

<BODY BGCOLOR="#FFFFFF" onload="PlaySound()">

</BODY>
</HTML>
<-------------------end of frame2a.html------------->

<------------------frame1b.html----------------->
<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>

<BODY BGCOLOR="#FFFFFF">

<IMG SRC="img00002.gif">

</BODY>
</HTML>
<--------------------end of frame1b.html--------------->

A good refernce for Javascript is

http://www.webreference.com/javascript/


Any problems then please contact me

tmunday@pcmaritime.co.uk

0
 
lafrancAuthor Commented:
Edited text of question
0
 
vanbascoCommented:
Hello,

well what you want is too difficult to solve without Java/Javascript.
But I'm not sure whether this will work with your Midi, since I'm not
aware of Javascripts midi functions. I'll check out and let you know.
0
 
RM032397Commented:
<A HREF="" onclick="image1()">START</A>

could cause some problems where browsers execute the HREF before the onClick the alternative is :

<A HREF="javascript:image1()">START</A>

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.