JavaScript - How To: Wmp Or Qt Embedded Jukebox
Similar Tutorials09-01-10 Not sure exactly where to post this thread as it involves HTML, Javascript and embedded media players. It probably would be more appropriate here as there is much Javascript involved.... Hello, I am trying to construct a Jukebox for my website. I have spent considerable time all over the WEB and at this forum which addressed the issue in a 50 page thread. Please see: http://codingforums.com/showthread.php?t=50666 I got a lot of ideas from this thread but still cannot figure a way to do the following within the Jukebox. These are my main two questions for everything below: 1. How can I have the Jukebox cycle through all tunes and then start over from the beginning? 2. How can I allow the user to select a tune from a list but not a drop down list, have the Jukebox start from the user’s selection and then play all songs to the end. Then as in #1, start over from the beginning? Per this thread I came away with basically two ways to assemble the jukebox. One uses links in a drop down list which the user can choose from. The other is to use an .m3u playlist. The user can only select a “playlist” from the drop down. Below, I have included the code for each Jukebox. To see the Jukeboxes in action please go to my website where I have posted some test pages exhibiting the jukeboxes that I am referring to. The following is the Jukebox which utilizes an .m3u playlist. If I end up using this idea I would like the tunes in the .m3u playlist to be displayed and allow the user to be able to choose a tune in the list. Then have the list play to the end of all tunes in the list. Then start over from the beginning of the list. After this code is the .m3u playlist. Go to url removed and click on the link that says: “Media Player Using an .M3U Playlist” Jukebox utilizing an .m3u playlist: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <style type="text/css"> body { text-align:center; } </style> <script type="text/javascript"> function PlayIt(what){ player.document.getElementById('music').innerHTML='<object width="300" height="300" ' +'classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" ' +'codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" ' +'standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">' +'<param name="url" value="'+what+'">' +'<param name="uiMode" value="full">' +'<param name="autoStart" value="true">' +'<param name="loop" value="true">' +'<embed type="application/x-mplayer2" ' +'pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" ' +'showcontrols="true" uimode="full" width="300" height="45" ' +'src="'+what+'" autostart="true" loop="true">' +'</object>'; } </script> </head> <body> <div id="music"> <object width="300" height="300" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject"> <param name="url" value=""> <param name="uiMode" value="full"> <param name="autoStart" value="true"> <param name="loop" value="true"> <embed type="application/x-mplayer2" pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" showcontrols="true" uimode="full" width="300" height="45" src="" autostart="true" loop="true"> </object> </div> <br> <br> <select name="player" onchange="PlayIt(this.value)"> <option value="none">::Choose a Song::</option> <option value="JukeboxList.m3u">Jukebox List</option> </select><br> </html> Here is the .m3u playlist for the above code: Code: #EXTM3U #EXTINF:Bill Evans - G Waltz media/G Waltz.mp3 #EXTINF:Dan Pincus - In Your Time media/In Your Time.mp3 The following code is for the Jukebox that has a list of links in a dropdown list. If I go with this idea, I would like for the list not to be a dropdown list but just a list of tunes. The user should be able to click on any tune in the list and the player should start from that point, play all the remaining tunes in the list and then start from the beginning. Go to url removed and click on the link that says: “Media Player Using Links” Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <style type="text/css"> body { text-align:center; } </style> <script type="text/javascript"> function PlayIt(what){ player.document.getElementById('music').innerHTML='<object width="300" height="300" ' +'classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" ' +'codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" ' +'standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">' +'<param name="url" value="'+what+'">' +'<param name="uiMode" value="full">' +'<param name="autoStart" value="true">' +'<param name="loop" value="true">' +'<embed type="application/x-mplayer2" ' +'pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" ' +'showcontrols="true" uimode="full" width="300" height="45" ' +'src="'+what+'" autostart="true" loop="true">' +'</object>'; } </script> </head> <body> <select name="player" onchange="PlayIt(this.value)"> <option value="none">::Choose a Song::</option> <option value="media/GWaltz.mp3">G Waltz</option> <option value="media/InYourTime.mp3">In Your Time</option> <option value="http://urltosong3.mp3">Song 3</option> <option value="http://urltosong4.mp3">Song 4</option> <option value="http://urltosong5.mp3">Song 5</option> </select><br> <div id="music"> <object width="300" height="300" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject"> <param name="url" value=""> <param name="uiMode" value="full"> <param name="autoStart" value="true"> <param name="loop" value="true"> <embed type="application/x-mplayer2" pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" showcontrols="true" uimode="full" width="300" height="45" src="" autostart="true" loop="true"> </object> </div> </html> Another idea I found on the WEB also uses an .m3u playlist. The good thing about it is that it lists all the tunes in the playlist which the user can then select from. This jukebox calls up an entire Windows Media Player. If I was to use this idea I would like to be able to disable the left side of the player where the user has options such as burning to CD, Media Guide, Radio Tuner etc… Go to url removed and click on the link that says: “Media Player Within an IFrame Using .m3u Playlist”” Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JukeBox</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="Expires" content="-1"> </head> <body> <IFRAME name="frame" src="JukeboxList.m3u" width="100%" height="347" scrolling="no" frameborder="0"> [Your user agent does not support frames or is currently configured not to display frames.] </IFRAME> </body> </html> Thanks! Dan Hi, I need to have a forced focus on a password field which is in an embedded JSP (<%@ include file="password.jsp" %>, this password.jsp doesnt has any body or form tag). I am facing some wierd issues in achieving as desired. The below code (in the parent JSP) DOESNT WORKS: window.onload = function() { document.<formname>.<fieldname>.focus() } here <fieldname> is in password.jsp and not the parent jsp when changed as below IT WORKS(obviously with an alert box which i dont want): window.onload = function() { alert("hi") document.<formname>.<fieldname>.focus() } i cannot use <body onLoad> due to third party javascript component constraints Help please... Hi, I was hoping someone might have a solution to randomizing a URL in javascript... in this case for an embedded Simpleviewer link? At the moment the link is http://timperceval.com/guiran/intro1/ but I would like to have the site randomly choose from four URLs. The embedded code is as follows: <!--START SIMPLEVIEWER EMBED.--> <script type="text/javascript" src="http://timperceval.com/guiran/intro1/svcore/js/simpleviewer.js"></script> <script type="text/javascript"> var flashvars = {}; flashvars.baseURL = "http://timperceval.com/guiran/intro1/"; simpleviewer.ready(function () { simpleviewer.load("sv-container", "100%", "100%", "000000", true, flashvars); }); </script> <div id="sv-container"></div> <!-- END SIMPLEVIEWER EMBED -- Any ideas would really help! Thanks, Tim basically...i have a popup overlay that keeps gettin covered by the flash videos my friend embeds all over the website this is easily avoided using addParam('wmode', 'transparent','true'); but is there a script that can add that transparent line of code to every flash video soon as the page loads...so i dont gotta one by one every youtube Hi, This is a noob question which I've searched all over for but can't find an answer..........which means it probably isn't possible Can I pass a parameter to a javascript function from embedded javascript? I have a function in a separate .js file which accepts a parameter as follows: function initialize(menu){ alert(menu); } When I use the following javascript embedded in my HTML it doesn't work: <SCRIPT LANGUAGE="javascript"> <!-- window.onload = initialize('testMenu'); // --> </SCRIPT> Am I doing something wrong or is this not possible? Thanks for your help Hey Everyone! I currently using the <object> tag to display a webpage in another webpage... essentially. I read that <iframe> is basically deprecated and <object> should be used to replace it. Thus my code breaks down basically to this: Code: <object data="mywebpage.php"></object> I'm using FF3 and the question I have is how do I print the contents of the object only? Currently, I have to right click the object and under "This Frame" click Print. How can I use a print button to resolve this? Thanks! I have created a webpage using wordpress for a customer, he wants an embedded video to be played every time a visitor comes to the websites. i did it in the beginning with you tube and it was easy but he is hosting his videos in a lame company and no matter what i try, i am not able to make the video play on load, guys can you please help me with this. here is an example of embed code from that website <object id="player" width="550" height="380" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" ><param name="movie" value="http://www.videozer.com/embed/RLyPu" ></param><param name="allowFullScreen" value="true" ></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.videozer.com/embed/RLyPu" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="550" height="380"></embed></object> Dear friends, Industry feedback in 'advertising world' is that I really could do with moving mini flash vids as thumbnail links, not static thumbnails if possible. This is where I am up to for you kind folk to see - http://www.spectral.org.uk/test5/work7.htm The playback of the flash vids (in the big playback area right/mid of screen) from the JPG thumbnail links on the TOP ROW works FINE, but how do I similarly call that 'BIGFLASH' function to display the video right-centre linking from the JW Flash Player vid thumbnail equivalents on rows TWO and THREE? Do Flash vids defo overide all other functionality (and thus the 'linking hand' hovering icon) we could otherwise use to "couch" the object (ie, in this case, the calling of the flash routine) like using javascript OnClick, etc or do we need to try and "con" the FLASHVARS within the flash player using the flashvar "DISPLAYCLICK:" ( http://developer.longtailvideo.com/trac/wiki/FlashVars ) to do something javascripty and invoke the 'BIGFLASH' function? The parameter options seem limited though don't they... as far as I can tell you can't use the DISPLAYCLICK flashvar to call a bespoke JS routine. I wonder if it is possible to put a transparent layer OVER the flash vid in JW Player and use that as the link, or does flash not allow other layers superimposed over it? My hands seem to be bound unless I am not seeing the wood for the trees! I really like the layout as it is and the coding and the fact I'm nearly there so I would hate to have to do something radically different at this stage. Why is such an obvious function so difficult to achieve?! Looking forward to your input as ever guys! Best - Dom Hi all, I am rather stuck with the following code and am finding it tough to find resources to help me. I am new to DOM functions and any explanation would be much appreciated! Code: var DATE = {date: xxx, layers: {top: 'topLayer' }, ids: [xxx], go: function() {} }; I also need to add a function to the variable 'DATE' so that it can register DOM events, then modify 'DATE' so that it adds another name-value pair to layers on page. I have been trying to working this out for 24 hours now and am very confused. Any support would be awesome! Thank you! Firstly let me say, im relatively new to Javascript so im still picking things up.. I have a website that i want to add several mp3's onto. When a user clicks a link i wanted to make javascript change the streaming audio to the one that was selected. My HTML is as follows.. Code: <table style="background-color:Black; color:gold; font-weight:700; font-size:16px"> <tr onClick="Click('http://www.m-hops.co.uk/Music/Motown Flavours.mp3')"><td> 1. Motown Flavours </td></tr> <tr onClick="Click('http://www.m-hops.co.uk/Music/All_Around_The_World.mp3')"><td> 2. All Around The World </td></tr> <tr><td> <OBJECT ID="MediaPlayer" WIDTH="290" HEIGHT="50" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject"> <PARAM id="TRACK" name="FileName" value="http://www.m-hops.co.uk/Music/Motown Flavours.mp3"> <PARAM name="autostart" value="true"> <PARAM name="ShowControls" value="true"> <param name="ShowStatusBar" value="true"> <EMBED id="sound" TYPE="application/x-mplayer2" src="" NAME="MediaPlayer" WIDTH="290" HEIGHT="50" ShowControls="1" ShowStatusBar="1" autostart="1"> </EMBED> </OBJECT> </td></tr> </table> and my Javascript is.. Code: <script language="javascript" type="text/javascript"> function Click(track) { document.getElementById('TRACK').value = track; window.alert(document.getElementById('TRACK').value); } </script> It appears that the right track is being parsed to the javascript but its not changing the audio thats being played. Any ideas?? Hello everyone, I have tried about 8 different variations of code to try to get this to work properly and cannot accomplish it. Please help if you can figure it out. I have 2 div's that are hidden. each div contains a FLV video, autostart=false. when button 1 is clicked, DIV 1 becomes visible and you may click on video to start playing it. When button 2 is clicked, DIV 1 goes to hidden and DIV 2 becomes visible with video 2. -- Ok so problem is this, the video that was playing in DIV 1 remains playing or at least the audio remains playing. If video 2 is started then you have 1 video source and 2 audio sources playing. I am trying to get the video in DIV 1 or DIV 2 to STOP or PAUSE when the DIV's state becomes hidden. here is the last code I tried below before frustration over come me. any suggestions would be great. Robert Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <style type="text/css"> <!-- #Layer1 { position:absolute; width:200px; height:115px; z-index:1; left: 13px; top: 47px; visibility: hidden; } #Layer2 { position:absolute; width:600px; height:645px; z-index:2; left: 14px; top: 47px; visibility: hidden; } --> </style> <script type="text/JavaScript"> <!-- 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_showHideLayers() { //v6.0 var i,p,v,obj,args=MM_showHideLayers.arguments; for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2]; if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; } obj.visibility=v;} } function MM_popupMsg(msg) { //v1.0 alert(msg); } //--> </script> </head> <img src="chastain cd landing pages/atlanta-ga-carpet-upholstery-cleaning.com/images/phone.jpg" alt="Button to Display DIV 1" width="27" height="22" onclick="MM_showHideLayers('Layer1','','show','Layer2','','hide')" /> <img src="chastain cd landing pages/atlanta-ga-carpet-upholstery-cleaning.com/images/spacer.gif" width="60" height="1" /> <img src="chastain cd landing pages/atlanta-ga-carpet-upholstery-cleaning.com/images/phone.jpg" alt="Button to Display Div 2" width="27" height="22" onclick="MM_showHideLayers('Layer1','','hide','Layer2','','show')"/> <div id="Layer1">VIDEO 1 <object id="player1" type="application/x-shockwave-flash" width="600" height="600" wmode="transparent" data="http://www.dryconcepts.com/videos/flvplayer.swf?file=http://www.dryconcepts.com/videos/video1.flv&autoStart=false"> <param name="movie" value="http://www.dryconcepts.com/videos/flvplayer.swf?file=http://www.dryconcepts.com/videos/video1.flv&autoStart=false" /> <param name="wmode" value="transparent" /> </object> </div> <div id="Layer2">VIDEO 2 <object id="player2" type="application/x-shockwave-flash" width="600" height="600" wmode="transparent" data="http://www.dryconcepts.com/videos/flvplayer.swf?file=http://www.dryconcepts.com/videos/video1.flv&autoStart=false"> <param name="movie" value="http://www.dryconcepts.com/videos/flvplayer.swf?file=http://www.dryconcepts.com/videos/video1.flv&autoStart=false" /> <param name="wmode" value="transparent" /> </object> </div> </body> </html> I have an embedded font in my CSS however somtimes the texts loads before the font loads (i.e. the text is loaded in a normal font the it changes after). Is there anyway i can say dont load page until the font file is loaded, or maybe dont show the div until the font is loaded?
I have been searching for an answer to this pretty much all day... I'm fed up. Can someone help? I want to be able to open wmv videos in an embedded windows movie player using javascript. Something identical to what you will find he http://www.hunlock.com/blogs/Everyth...ding#quickIDX2...go down to the heading :'How to make a video select list'. I am trying to emulate this but for wmv files and windows media player rather than for flsh files. I have tested this on one link and it does not open. i just get a black media screen and nothing. Here's my code: Here's the script within the head tag: Code: <script type="text/javascript">function playVideo(sourceId, targetId) { if (typeof(sourceId)=='string') {sourceId=document.getElementById(sourceId);} if (typeof(targetId)=='string') {targetId=document.getElementById(targetId);} targetId.innerHTML=sourceId.innerHTML; return false;}</script> Here`s the link: Code: <a href="#" onclick='return playVideo("selectdemo1","videoPlayback")'> video 1</a> and here's the embedding and the play back code (The play back area is within the same page as the link): Code: div id="selectdemo1"> <OBJECT id='mediaPlayer' width="450" height="445" classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95' codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701' standby='Loading Microsoft Windows Media Player components...' type='application/x-oleobject'> <param name='fileName' value="\\HOC\AdminPrivate\FS08U\TurgeL\Documents\Site Web\videos\Add_Documents.wmv"> <param name='animationatStart' value='true'> <param name='transparentatStart' value='true'> <param name='autoStart' value="false"> <param name='showControls' value="true"> <param name='loop' value="false"> <EMBED type='application/x-mplayer2' pluginspage='http://microsoft.com/windows/mediaplayer/en/download/' id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='-1' bgcolor='darkblue' showcontrols="true" showtracker='-1' showdisplay='0' showstatusbar='-1' videoborder3d='-1' width="450" height="445" src="http://servername/\\\\HOC\\AdminPrivate\\FS08U\\TurgeL\\Documents\\Site Web\\videos\\Add_Documents.wmv&autoplay=1" autostart="false" designtimesp='5311' loop="false"> </EMBED> </OBJECT> </div> </div> Please help meeeeeeeeeeeeeeeeeeee! I wrote this to trigger a video when an image is clicked, but it doesnt work. Any help? Code: <head> <style> #movie {} #img {} </style> </head> <body> <embed type="application/x-vlc-plugin" name="VLC" rel="nofollow" target="mymovie.webm" id="movie" > </embed> <img src=myimage.jpg" id="img" /> <script> var v = document.getElementById("movie"); var i = document.getElementById("img"); i.onclick = function() { v.play(); }; </script> </body> Hi codingforums! glad to meet you. I am not an expert in javascripting, so forgive me. What i am trying to do is disable embedded pdf documents from being scrolled up and down with the middle mousewheel button on the mouse. Here is the reason why... I am using embedded PDF files as a way to easily display reports through a browser (FireFox). The actual PDF is about 10 pages long, but the HTML page is coded with the embed tag and uses the Open Parameters to display just a few aspects of the PDF, in an easy to read format. The annoying part is that the embedded PDF sections can accidentally be scrolled with the mousewheel, which ruins the look of the report in the browser. Is there a way to disable this? In the example below you can see i tried to disable the mousewheel scroll on the first div. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <META HTTP-EQUIV="REFRESH" CONTENT="2000"> <link rel="stylesheet" type="text/css" href="db.css" /> <script type="text/javascript"> if(document.addEventListener){ /* Chrome, Safari, Firefox */ document.addEventListener('DOMMouseScroll', stopWheel, false); } function stopWheel(e){ if(e.preventDefault) { e.preventDefault(); } /* Chrome, Safari, Firefox */ } </script> </head> <body id="pdf"> <div id="mid" onMouseOver="stopWheel(e);"><embed src="run_rate_original_test.pdf#page=1&toolbar=0&navpanes=0&scrollbar=0&zoom=100,135,400" width="900" height="325"/></div> <div id="l1"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,105" width="119" height="83"/></div> <div id="l2"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,105" width="119" height="83"/></div> <div id="l3"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,835,105" width="119" height="83"/></div> <div id="l4"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,233" width="119" height="83"/></div> <div id="l5"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,233" width="119" height="83"/></div> <div id="l6"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,835,233" width="119" height="83"/></div> <div id="l7"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,361" width="119" height="83"/></div> <div id="l8"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,361" width="119" height="83"/></div> <div id="l9"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,835,361" width="119" height="83"/></div> <div id="l10"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,489" width="119" height="83"/></div> <div id="l11"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,489" width="119" height="83"/></div> <div id="l12"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,835,489" width="119" height="83"/></div> <div id="l13"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,617" width="119" height="83"/></div> <div id="l14"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,617" width="119" height="83"/></div> <div id="l15"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,835,617" width="119" height="83"/></div> <div id="l16"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,134,745" width="119" height="83"/></div> <div id="l17"><embed src="run_rate_original_test.pdf#page=5&toolbar=0&navpanes=0&scrollbar=0&zoom=75,484,745" width="119" height="83"/></div> </body> </html> As you can see in the first div, i was trying to use javascript to disable the mouse wheel, which did not work. Since each div is a snapshot of the embedded pdf file, is there a javascript that can disable the mousewheel scroll for each section by placing it in the body tag? Thank you anyone who can help! I have a javascript sound board that I've made for a Church skit but I'm wanting to be able to smoothly fade out the longer SFX without having to do it manually with the volume slider. The Object: Code: <span id="player_holder"><embed id="player" hidden="true" autostart="true" loop="false" volume="100"/></span> How do I modify the volume value from: Code: document.getElementById('player') Any ideas? These are two nearly identical test links: http://www.newcityvegas.com/test-js-chrome.html http://www.newcityvegas.com/test-js-chrome.php Both behave the same in Firefox 3.6.9, Opera 10.61, Maxthon 2.5.15, and IE 8.6100. While the PHP version works the same in Chrome 6.0.472, Chrome fails to display the weather image in the HTML version. Code: HTML version: <script type="text/javascript" src="http://pics3.city-data.com/wx/wx-Las-Vegas-Nevada.js"></script> PHP version: <? echo '<script type="text/javascript" src="http://pics3.city-data.com/wx/wx-Las-Vegas-Nevada.js"></script>'; ?> Anyone care to explain why? I hate to add the extra PHP-vs-HTML overhead if not necessary. Here's the simple external JS-to-HTML code: Code: document.write('<a href="http://www.city-data.com/forecast/w-Las-Vegas-Nevada.html"><div class="wxbox"> <img class="wximg" alt="Clear" title="Clear" src="http://pics3.city-data.com/images/wx/1.png" /> <div class="wxtemp" title="Temperatu 79°F (26°C)">79°F</div> <div class="wxvis" title="Visibility: 10 miles">10 miles</div> <div class="wxother" title="Wind: varies at 3 mph, Pressu 1010 hPa (29.82 in Hg), Humidity: 21%">Wind: varies 3 mph<br />Pressu 29.82 in<br />Humidity: 21%</div></div></a>'); I have a php page that essentially builds a pay report in the form of a table. The php side builds the page properly, though it took some time to get the table rows onmouseover and onmouseout functions to work for row highlighting. Now the issue is the table row's onclick function. Here is what the outputed html looks like. Code: <head> <script type="text/javascript" language="javascript"> function HideShowDiv(divID) { if (document.getElementById(divID).style.display == "none") { document.getElementById(divID).style.display = "block"); document.writeln("show "+divID); } else { document.getElementById(divID).style.display = "none"; document.writeln("hide "+divID); } } </script> <STYLE> <!-- tr { background-color: transparent} .normal { background-color: transparent } .highlight { background-color: #dcfac9 } //--> </style></head> <body> <!-- Start the main body DIV tag --> <div id="PageBodyFrame" align="center"> <table width="80%"> <tr><td colspan="4">Georgetown Youth Baseball Association</td></tr> <tr onMouseOver="this.className='highlight'" onMouseOut="this.className='normal'" onClick="HideShowDiv('HD1');"> <td align="left">James Beach</td> <td align="center">1 Game(s)</td> <td align="right">$22.5 owed</td> <td align="center"><a href="pay_report.php?t=l&l=3&act=check&u=1">Cut Check</a></td> </tr> <!-- First hidden div embedded in the next row of main table --> <tr><td colspan="4"> <div id="HD1" style="display:none;"> <table><tr> <td align="center">Game Date</td> <td align="center">Teams</td> <td align="right">Fee</td></tr> <tr> <td align="center">2011-08-06</td> <td align="center">Marin vs LBF</td> <td align="right">\$22.50</td> </tr></table></div></td></tr> <tr onMouseOver="this.className='highlight'" onMouseOut="this.className='normal'" onClick="HideShowDiv('HD3');"> <td align="left">John Carpenter</td> <td align="center">0 Game(s)</td> <td align="right">$1.5 owed</td> <td align="center"><a href="pay_report.php?t=l&l=3&act=check&a=3">Cut Check</a></td> </tr> <!-- Second Hidden div embedded in table row --> <tr><td colspan="4"> <div id="HD3" style="display:none;"> <table><tr> <td align="center">Game Date</td> <td align="center">Teams</td> <td align="right">Fee</td> </tr> <tr> <td align="center">2011-08-06</td> <td align="center">Assigner Fee</td> <td align="right">\$1.50</td> </tr></table></div></td></tr> <tr> <td colspan="2" align="right">Some Association of Baseball</td> <td align="right">\$24</td> <td align="center"></td> </tr> </table> </div> <!-- Closes the main body div container --> In my javascript function, the writeln() calls are for testing to see if the even is even firing. but nothing gets written to the page. Any thoughts on this would be greatly appreciated. Basically I want the row with the users name to be clickable which will show the details in the hidden div associated with the user. Hi, I have a external file for example abc.js ,in this abc.js file no functions ,it contains some scripting,i want to call the scripting file though html I use the code <script type="text/javascript src="abc.js"></script> in the header file but i want it in a href tag any clues really helpful. thankyou all. Hi all , I need some help in altering the location tag and the View Larger Map links to open in a new window, currently it opens in the same window. I didn't set any links myself, they were already in the code that I got from Google Maps, I placed it on my page as a custom script. I tried to edit it myself and other frames on my page got all muddle up in preview !!!!! _THE CODE_ <iframe width="350" height="280" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/?ie=UTF8&ll=37.109574,-8.030563&spn=0.011328,0.022724&t=h&z=16&output=embed"></iframe><br /><small><a href="http://maps.google.com/?ie=UTF8&ll=37.109574,-8.030563&spn=0.011328,0.022724&t=h&z=16&source=embed" style="color:#0000FF;text-align:left">View Larger Map</a></small> |