By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,462 Members | 1,126 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,462 IT Pros & Developers. It's quick & easy.

Controlling arrays of quicktime videos with .onmouseclick

P: 1
hi there,

I am wondering how i can go about loading an array with quicktime videos then using js to dynamically embedd movies as they are needed into the webpage (if it is possible?)

I have a js file that loads information in an array for an image map as to what it should do when onmouseover and onmouseout. I then call that array when the mouse moves around.

however on onmouseclick, i'd like the image to turn the image into a quicktime movie. I can make this work the brut force way (by makeing another html page that has a quicktime movie embedded), but id like to do it in a more elegant way if possible.

here is a simplified/shortened version of my js so far if my explaination is unclear as to what im doing (which is likely:P). any sort of guidance would be greatly appreciated!

Expand|Select|Wrap|Line Numbers
  1.  
  2. var mouseOvers = new Array();
  3. var mouseOuts;
  4. var mouseIsClicked;
  5.  
  6. window.onload = function()
  7. {
  8.   loadAll(document.getElementById('map1'));
  9.   loadAll(document.getElementById('map2'));
  10. }
  11.  
  12. function loadAll(arrayLoading)
  13. {
  14.   var areas = arrayLoading.getElementsByTagName('area'); 
  15.  
  16.   for(var i=0;i<areas.length;i++) 
  17.   {
  18.     areas[i].onmouseover = mouseIsOver;
  19.     areas[i].onmouseout = mouseIsOut;
  20.     areas[i].onmouseclick = mouseIsClicked;
  21.     areas[i].number = i;
  22.  
  23.     mouseOvers[i] = new Image();                            
  24.     mouseOvers[i].number = i;
  25.  
  26.     switch(i)
  27.     {
  28.       case 0: mouseOvers[i].main = './pics/ortho/mortho_wd.jpg';
  29.                 //stuck here
  30.               //mouseIsClicked[i].movie = './quick/quick1.mov';
  31.         break;
  32.       default: alert('Oops! Make sure you have enough cases to match your number of areas!')
  33.         break;
  34.     }
  35.   }
  36.  
  37.  
  38.  
  39. }
  40.  
  41.  
  42.     function mouseIsOver()
  43. {
  44.  
  45.     var navigate = document.getElementById('map1');
  46.     var navImg = navigate.getElementsByTagName('img'); 
  47.  
  48.     navImg[0].src = mouseOvers[this.number].main;
  49.  
  50. }
  51.  
  52.     function mouseIsOut()
  53. {
  54.  
  55.     var navigate = document.getElementById('map1');
  56.     var navImg = navigate.getElementsByTagName('img'); 
  57.  
  58.     navImg[0].src = './pics/ortho/mortho.jpg';
  59. }
  60.  
  61.     function mouseIsClicked()
  62.  
  63. {
  64.     alert('im in the click')
  65.     //content.innerHTML= mouseOvers[this.number].txt
  66.  
  67. }
  68.  
  69.  
  70.  
  71.  
Nov 27 '06 #1
Share this Question
Share on Google+
1 Reply


acoder
Expert Mod 15k+
P: 16,027
There's no onmouseclick, use onclick instead.

As for the videos, keep the srcs of the movies in an array. Either have the HTML movie code (object/embed) ready, but hidden at the same position as the image (probably the better option) and change the src, or dynamically create the Quicktime plugin each time and replace the image. This link may help.
May 30 '08 #2

Post your reply

Sign in to post your reply or Sign up for a free account.