teacher Posted September 3, 2006 Share Posted September 3, 2006 I know it can be done. I have not found a tutorial nor a page I could copy as a template. Daughter's web site has a demo reel link. She wants to be able to click on the link and go to a demo page where she displays the demo reel (currently http://www.jenraygenre.com/Comp%201_3.avi) on the page. Using my Mac and Firefox that is what it does. Windows is a different story. Also the Mac uses a plain background and I believe she wants a solid colored brown background to match what is there. We are also looking at putting a high resolution and a low resolution video there.Can you point me to instructions or ideas of how to make it look good and work that way? I don't know if the final demo will be avi or mov or if it makes any difference. Quote Link to comment Share on other sites More sharing options...
Peachy Posted September 3, 2006 Share Posted September 3, 2006 Julia, Check out my page I use to show my web design students how to embed multimedia in a web page:http://fleming0.flemingc.on.ca/~pchee/fts/.../multimedia.htm Quote Link to comment Share on other sites More sharing options...
teacher Posted September 3, 2006 Author Share Posted September 3, 2006 So in this case I would insert this code after I verify the width and height? <object id="qtplayer"classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"codebase="http://www.apple.com/qtactivex/qtplugin.cab">width="320" height="26"><param name="controller" value="TRUE"><param name="autoplay" value="FALSE"><param name="src" value="Comp&201_3.avi"><embed src="Comp%201_3.avi" width="320"height="200" autoplay="FALSE"controller="TRUE"pluginspage="http://www.apple.com/quicktime/download/" /> </object> Where does the classid come from or is that always the same for quicktime? Quote Link to comment Share on other sites More sharing options...
Peachy Posted September 3, 2006 Share Posted September 3, 2006 It's the unique class id for QuickTime. Microsoft and Apple agreed to that. Each format has a unique well-known class ID. Quote Link to comment Share on other sites More sharing options...
teacher Posted September 3, 2006 Author Share Posted September 3, 2006 Thanks I am booting up the PC so I can load Dreamweaver and give it a try. I don't have Dreamweaver for my Mac yet. Quote Link to comment Share on other sites More sharing options...
teacher Posted September 3, 2006 Author Share Posted September 3, 2006 I am getting a big variation between browsers and operating systems. It just does not look professional yet. Here's the page. That really looks bad in Mac but looks ok in IE7Beta whatever. Firefox is not the best either. Here is the coding for the whole page: <html><head><title>Demo Reel</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><!-- ImageReady Preload Script (blank.psd) --><script type="text/javascript"><!--function newImage(arg) { if (document.images) { rslt = new Image(); rslt.src = arg; return rslt; }}function changeImages() { if (document.images && (preloadFlag == true)) { for (var i=0; i<changeImages.arguments.length; i+=2) { document[changeImages.arguments[i]].src = changeImages.arguments[i+1]; } }}var preloadFlag = false;function preloadImages() { if (document.images) { home_over = newImage("images/home-over.gif"); demo_over = newImage("images/demo-over.gif"); resume_over = newImage("images/resume-over.gif"); flatbook_over = newImage("images/flatbook-over.gif"); contact_over = newImage("images/contact-over.gif"); preloadFlag = true; }}// --></script><!-- End Preload Script --></head><body bgcolor="#492d0a" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();"></object><!-- ImageReady Slices (blank.psd) --><table id="Table_01" width="900" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="7"> <img src="images/demo_01.gif" width="900" height="15" alt=""></td> </tr> <tr> <td colspan="2" rowspan="2" valign="baseline"> <img src="images/demo_02.gif" width="186" height="471" alt=""></td> <td height="261" colspan="3"> [color="#990000"] [color="#000000"]<object id="qtplayer"classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"codebase="http://www.apple.com/qtactivex/qtplugin.cab"> <width="320" height="26"> <param name="controller" value="TRUE">[/color][/color][color="#000000"] <param name="autoplay" value="FALSE"> <param name="src" value="Comp&201_3.avi"> <embed src="Comp1_3.avi" width="320"height="240" autoplay="FALSE"controller="TRUE"pluginspage="http://www.apple.com/quicktime/download/" /> </object></td> <td colspan="2" rowspan="2"> <img src="images/demo_04.gif" width="205" height="471" alt=""></td> </tr> <tr> <td colspan="3" valign="bottom"ro><img src="images/demo_05.gif" width="509" height="64" alt=""></td>[/color][color="#000000"] </tr>[/color] <tr> <td> <a href="index.html" onmouseover="changeImages('home', 'images/home-over.gif'); return true;" onmouseout="changeImages('home', 'images/home.gif'); return true;" onmousedown="changeImages('home', 'images/home-over.gif'); return true;" onmouseup="changeImages('home', 'images/home-over.gif'); return true;"> <img name="home" src="images/home.gif" width="140" height="52" border="0" alt="Home"></a></td> <td colspan="2"> <a href="demo2.htm" onmouseover="changeImages('demo', 'images/demo-over.gif'); return true;" onmouseout="changeImages('demo', 'images/demo.gif'); return true;" onmousedown="changeImages('demo', 'images/demo-over.gif'); return true;" onmouseup="changeImages('demo', 'images/demo-over.gif'); return true;"> <img name="demo" src="images/demo.gif" width="168" height="52" border="0" alt="Demo Reel"></a></td> <td> <a href="resume.html" onmouseover="changeImages('resume', 'images/resume-over.gif'); return true;" onmouseout="changeImages('resume', 'images/resume.gif'); return true;" onmousedown="changeImages('resume', 'images/resume-over.gif'); return true;" onmouseup="changeImages('resume', 'images/resume-over.gif'); return true;"> <img name="resume" src="images/resume.gif" width="148" height="52" border="0" alt="Resume"></a></td> <td colspan="2"> <a href="book_0.html" onmouseover="changeImages('flatbook', 'images/flatbook-over.gif'); return true;" onmouseout="changeImages('flatbook', 'images/flatbook.gif'); return true;" onmousedown="changeImages('flatbook', 'images/flatbook-over.gif'); return true;" onmouseup="changeImages('flatbook', 'images/flatbook-over.gif'); return true;"> <img name="flatbook" src="images/flatbook.gif" width="270" height="52" border="0" alt="Digital Flatbook"></a></td> <td> <a href="#mailto:jenray@jenraygenre.com" onmouseover="changeImages('contact', 'images/contact-over.gif'); return true;" onmouseout="changeImages('contact', 'images/contact.gif'); return true;" onmousedown="changeImages('contact', 'images/contact-over.gif'); return true;" onmouseup="changeImages('contact', 'images/contact-over.gif'); return true;"> <img name="contact" src="images/contact.gif" width="174" height="52" border="0" alt="Contact"></a></td> </tr> <tr> <td colspan="7"> <img src="images/demo_11.gif" width="900" height="35" alt=""></td> </tr> <tr> <td> <img src="images/spacer.gif" width="140" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="46" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="122" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="148" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="239" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="31" height="1" alt=""></td> <td> <img src="images/spacer.gif" width="174" height="1" alt=""></td> </tr></table><!-- End ImageReady Slices --></body> </html>Can you see what I am doing wrong? Is it because I am trying to put it into a table? Is there a better way to do this? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.