JavaScript - Multiple Js In One Html Page Issues
Hi All,
I have an issue that is driving me batty. I have two js files called in my <head> section but only the first one listed runs. I know this is supposed to work but it doesn't. What am I missing? I've searched here on the forum and on Google with no real results. I have read the info on javascriptkit but do not believe it applies. One script contains functions that run "onChange" of certain fields while the other runs "onSubmit" of the form. The "onChange" events from the first script run fine. The second one does not run at all. I get no errors. I can find no var conflicts. I even added an alert at the top of the main function in the second script to verify it was loading and the alert never pops up. Head Script Tags: (The first script called works fine.) Code: <script type = "text/javascript" src = "SQFImageSwap.js"></script> <script type = "text/javascript" src = "FormValidation.js"></script> Form Tag Call: (to second script) Code: <form id="Ostandard" name="standard" action="/cgi-bin/standardquoterequest.pl" method="POST" enctype="application/x-www-form-urlencodedl" onSubmit="return validFormSubmit(this)"> Thank You! -Jim Similar TutorialsHello All, I seem to be stuck on a page for my site: The idea was to have a page with a google map and a java-powered custom twitter feed on the page. However, when I got the map embedded, it seems to interfere with the spry navigation menu, and the twitter feed is not working either. I've tried combining commands and tying each script to an event, but I just don't understand enough to get them all to work. I'm a comic artist by trade, so I'm a little new to coding. Any help would be greatly appreciated! you can find the page here./ Thanks in advance for any help! i want to use arrays to populate an HTML list. I can populate the main list items but I can't seem to get the sub list items to work. Can anyone point out my mistake? Code: <HTML> <Body> <ul> <script> var pages = ["page1", "page2","page3"]; var subPages = ["sub1","sub2"]; for(var i = 0; i < pages.length; i++){ var page = pages[i]; document.write('<li>' + page + '</li>'); if (page == "page2"){ document.write('<ul>'); for(var i = 0; i < subPages.length; i++){ var subPage = subPages[i]; document.write('<li>' + subPage + '</li>'); } document.write('</ul'>); } } </script> </ul> </body> </HTML> I'm no coder, as you will soon discover. The web work I do is from a purely novice, even hobby standpoint and the sites I create and host are nothing more than favors for friends and acquaintances who have needed but have not had a presence on the web. This being explained, I am asking those with coding skills to please take a look at the site I've just completed for a little diner down the road. (They're just starting out and can't afford to pay a professional web designer and, unfortunately, are stuck with me.) The site is http://d-n-ddiner.com I'm the first to say that the mouseover sound would drive me crazy, but the guys who own the diner are enthusiastic and want it left as is. I have had to combine scripts in order to have the "black-and-white to color" image effect work simultaneously with sound. The sound script depends on uploaded files: soundmanager.js, soundcontroller.swf and sound-config.xml and its tags are found incorporated with each involved image, within the body. The image effects are just the result of playing around with bits and pieces I've seen, mucking about the Internet. Its script is found within the head and also within the body, in each involved image's area, in mouseover, mouseout and, of course when specifying "name=" (such as Img_1). I opted for providing the sound in this manner because I am able to use an .mp3 file, rather than having to weigh through the pros and cons of .au versus .wav, etc., and the fickle nature of different browsers and plug-in crashes. After having many test the site (friends with varying operating systems and browsers) it appears that this mp3 solution makes the mouseover sound available to a broader range of users. Success has been achieved with Firefox, Safari, Netscape, Omniweb and Chrome. However, Internet Explorer and Opera seem to be the holdouts for both Mac and PC users. All this brings me to two requests: Would someone take a look at the site (particularly with Firefox) to determine if something might be done to help the page load more smoothly? Secondly, is there some sleight-of-hand that might be incorporated into the script to help IE and Opera detect the mouseover sound or do you consider these two browsers essentially not worth the bother? I am attaching a zip of the sound files I mentioned. The mp3 is not included but any mp3 snippet would do for testing, provided the sound config file is edited to reflect its file name. My primary concern is smooth page-loading; the IE and Opera issue is of less importance. Thank you for your patience and for any assistance you would offer. I would like multiple videos one one page. I tried to give each one an individual id but failed miserably. Also how on earth do I assign a image to each player. My example works with one player only and falls back to HTML5 video with no problems . If I decided on five videos per page, how do I apply an id to each one as well as a different image per player. Here is what I have so far: Code: <script type="text/javascript" src="video/swfobject.js"></script> <script type="text/javascript"> var flashvars = {}; flashvars.src = "http://www.mysite.com.mp4"; flashvars.controlBarMode = "floating"; flashvars.poster = "http://mysite.com/imageonplayer.png"; var params = {}; params.allowfullscreen = "true"; params.allowscriptaccess = "always"; var attributes = {}; attributes.id = "videoDiv"; attributes.name = "myDynamicContent"; swfobject.embedSWF("http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf", "videoDiv", "487", "275", "10.1.0","expressInstall.swf", flashvars, params, attributes); </script> </head> Code: <div id="videoDiv"> <video controls="controls" poster="http://mysite.com/imageonplayer.png" width="487" height="275"> <source src="http://www.mysite.com/mymovie.mp4" type="video/mp4" /> <source src="http://www.mysite.com/mymovie.ogg" type="video/ogg" /> </video> </div> I assigned each player an individual id like this as suggested on another thread but that didn't work. Any suggestions? : Code: <script type="text/javascript"> swfobject.registerObject("videoDiv1", "10.1.0"); swfobject.registerObject("videoDiv2", "10.1.0"); swfobject.registerObject("videoDiv3", "10.1.0"); swfobject.registerObject("videoDiv4", "10.1.0"); </script> Thanks Dan I'm using this tooltip on my site: http://craigsworks.com/projects/simpletip/, I want to display some information about the user when someone hovers mouse on his/her username. This is the code I use to call simpletip: Code: $(document).ready(function(){ // Create your tooltips var api = $(".ttip a").simpletip().simpletip(); api.load('user.php'); }); The problem is that I want to determine the user id in order to retrieve according information from database. As I see from this code the address that should be call onmouseover is determined in advance. Is there a way to send some parameters (user id in this case) in user.php file according to which link is hovered? Hope I'm clear. I am trying to add Multiple NoobSlides onto one page. From the sample page listed he http://www.efectorelativo.net/laboratory/noobSlide/ I am trying to add two Sample 5 slideshows side by side on the same page, but when I try it, the second slideshow events don't trigger. The slide show image change works on the first one, but not the second one. Here is the code I am using: Code: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>noobSlide - mootools</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="http://www.efectorelativo.net/laboratory/noobSlide/_web.css" type="text/css" media="screen" /> <link rel="stylesheet" href="http://www.efectorelativo.net/laboratory/noobSlide/style.css" type="text/css" media="screen" /> <script type="text/javascript" src="http://www.efectorelativo.net/laboratory/js/mootools-1.2-core.js"></script> <script type="text/javascript" src="http://www.efectorelativo.net/laboratory/noobSlide/_class.noobSlide.packed.js"></script> <script type="text/javascript"> window.addEvent('domready',function(){ //SAMPLE 5 (mode: vertical, using "onWalk" ) var info5 = $('info5').set('opacity',0.5); var sampleObjectItems =[ {title:'Morbi elementum111', autor:'', date:'', link:'http://www.link11111.com'}, {title:'Mollis leo', autor:'Ipsum', date:'6 Dic 2007', link:'http://www.link2.com'}, {title:'Nunc adipiscing', autor:'Dolor', date:'9 Feb 2007', link:'http://www.link3.com'}, {title:'Phasellus volutpat pharetra', autor:'Sit', date:'22 Jul 2007', link:'http://www.link4.com'}, {title:'Sed sollicitudin diam', autor:'Amet', date:'30 Set 2007', link:'http://www.link5.com'}, {title:'Ut quis magna vel', autor:'Consecteur', date:'5 Nov 2007', link:'http://www.link6.com'}, {title:'Curabitur et ante in', autor:'Adipsim', date:'12 Mar 2007', link:'http://www.link7.com'}, {title:'Aliquam commodo', autor:'Colom', date:'10 Abr 2007', link:'http://www.link8.com'} ]; var nS5 = new noobSlide({ mode: 'vertical', box: $('box5'), size: 180, items: sampleObjectItems, addButtons: { previous: $('prev5'), play: $('play5'), stop: $('stop5'), next: $('next5') }, onWalk: function(currentItem){ info5.empty(); new Element('h4').set('html','<a href="'+currentItem.link+'">link</a>'+currentItem.title).inject(info5); } }); //SAMPLE 5a (mode: vertical, using "onWalk" ) var info5a = $('info5a').set('opacity',0.5); var sampleObjectItems2 =[ {title:'2222Morbi elementum111', autor:'', date:'', link:'http://www.link11111.com'}, {title:'2222Mollis leo', autor:'Ipsum', date:'6 Dic 2007', link:'http://www.link2.com'}, {title:'22222Nunc adipiscing', autor:'Dolor', date:'9 Feb 2007', link:'http://www.link3.com'}, {title:'2222Phasellus volutpat pharetra', autor:'Sit', date:'22 Jul 2007', link:'http://www.link4.com'}, {title:'2222Sed sollicitudin diam', autor:'Amet', date:'30 Set 2007', link:'http://www.link5.com'}, {title:'2222Ut quis magna vel', autor:'Consecteur', date:'5 Nov 2007', link:'http://www.link6.com'}, {title:'2222Curabitur et ante in', autor:'Adipsim', date:'12 Mar 2007', link:'http://www.link7.com'}, {title:'22222Aliquam commodo', autor:'Colom', date:'10 Abr 2007', link:'http://www.link8.com'} ]; var nS5a = new noobSlide({ mode: 'vertical', box: $('box5a'), size: 180, items: sampleObjectItems2, addButtons: { previous: $('prev5a'), play: $('play5a'), stop: $('stop5a'), next: $('next5a') }, onWalk: function(currentItem){ info5a.empty(); new Element('h4').set('html','<a href="'+currentItem.link+'">link</a>'+currentItem.title).inject(info5a); } }); }); </script> </head><div id="cont"> <!-- SAMPLE 5 --> <h2>Sample 5</h2> <div class="sample"> <table style="width: 100%" cellspacing="0" cellpadding="0" align="center"> <tr align="left"> <td> Ayer </td> <td>Actual </td> </tr> <td> <!-- SAMPLE 5 --> <div class="mask2" style="left: 0px; top: 0px; "> <div id="box5" style="left: 0px; top: 1px"> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img1.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img2.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img3.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img4.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img5.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img6.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img7.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img8.jpg" alt="Photo" /></span> </div> <div id="info5" class="info" style="left: 0px; bottom: 0; height: 21px"></div> </div> <p class="buttons"> <span id="prev5"><< Previous</span> <span id="play5">Play ></span> <span id="stop5">Stop</span> <span id="next5">Next >></span> </p> </td> <!-- SAMPLE 5a --> <td align="left"> <div class="mask2" style="left: 0px; top: 0px; "> <div id="box5a" style="left: 0px; top: 1px"> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img1.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img2.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img3.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img4.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img5.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img6.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img7.jpg" alt="Photo" /></span> <span><img src="http://www.efectorelativo.net/laboratory/noobSlide/img8.jpg" alt="Photo" /></span> </div> <div id="info5a" class="info" style="left: 0px; bottom: 0; height: 21px"></div> </div> <p class="buttons"> <span id="prev5a"><< Previous</span> <span id="play5a">Play ></span> <span id="stop5a">Stop</span> <span id="next5a">Next >></span> </p> </td> </table> </div> </div> </body> </html> I'm sure people have answered this question multiple times but I have done all the research and tried everything but nothing works. My problem: I'm building a website for my gaming clan and I want a Javascript news ticker/date & time and a Javascript navigation bar. However, when I put these codes in, they don't run with each other on the same page. Possibly an onload issue but like I said, I tried all the solutions. Note: they use jquery. I'll post the html and javascript files as txt files since I can't attach them in their normal form. Index.txt is my HTML Sliding_effect.txt is the Javascript for the menubar Newsticker.txt is the Javascript for the ticker that goes at the bottom of the <body> The actual ticker.js code that runs with newsticker.js was too large to attach. It's 7000 lines long. Any help is appreciated Hi all, I am a complete novice to pretty much everything internet but have managed to put together a site that I am trying to get off of the ground. Here is the problem that I am having. The first script below is for a script that shows up in my sidebar and is available on every page of my site. The second script is one that I intend to use on only one specific page. Both of the scripts function properly on their own but not when I try to use them as intended. As mentioned in the FAQ, I tried to name all of the variables with unique names but that still does not work. Any suggestions would be greatly appreciated!! This code is in my sidebar on every page: Code: <script type="text/javascript"> <!-- function calculate() { var doc = document.pointCalc; var points = 0; var fiber = doc.fiber.value; var fat = doc.fat.value; var calories = doc.calories.value; points = (calories / 50) + (fat / 12) - (fiber / 5); doc.result.value = Math.round(points); } // --> </script> <center> <br/> <br/> <div class="storyTitle"><b>Approximate Points Calculator</b></div> <div class="storyContent"> <form name="pointCalc"> <table><tr> <tr><td>Calories:</td><td><input name="calories" type="text"/></td></tr> <tr><td>Fat:</td><td><input name="fat" type="text"/></td></tr> <tr> <td>Fiber:</td> <td> <select name="fiber"> <option value="0"/>0 <option value="1"/>1 <option value="2"/>2 <option value="3"/>3 <option value="4"/>4 or more </select> </td> </tr> <tr><td colspan="2"><input value="Calculate" onclick="calculate();" type="button"/></td></tr> <tr><td>POINTS:</td><td><input name="result" type="text"/></td></tr> </tr></table> </form> </div></center> This code I'm trying to use on just one page of the site: Code: <center><script type="text/javascript"> <!-- function getpoints() { var doc1 = document.pointquiz; var dpoints = 0; var sex = doc1.sex.value; var age = doc1.age.value; var weight = doc1.weight.value; var height = doc1.height.value; var activity = doc1.activity.value; var nursing = doc1.nursing.value; dpoints = (sex * 1) + (age * 1) + (weight * 1) + (height * 1) + (activity * 1) + (nursing * 1); doc1.dresult.value = Math.round(dpoints); } // --> </script> <br /> <br /> <div class="storyTitle"><b>Daily Point Allowance Quiz</b></div> <div class="storyContent"> <form name="pointquiz"> <table><tr> <tr> <td>Sex:</td> <td> <select name="sex"> <option value="2" />Female <option value="8" />Male </select> </td> </tr> <tr> <td>Age:</td> <td> <select name="age"> <option value="4" />17-26 <option value="3" />27-37 <option value="2" />38-47 <option value="1" />48-58 <option value="0" />58+ </select> </td> </tr> <tr> <td>Weight:</td> <td> <select name="weight"> <option value="10" />100-109 <option value="11" />110-119 <option value="12" />120-129 <option value="13" />130-139 <option value="14" />140-149 <option value="15" />150-159 <option value="16" />160-169 <option value="17" />170-179 <option value="18" />180-189 <option value="19" />190-199 <option value="20" />200-209 <option value="21" />210-219 <option value="22" />220-229 <option value="23" />230-239 <option value="24" />240-249 <option value="25" />250-259 <option value="26" />260-269 <option value="27" />270-279 <option value="28" />280-289 <option value="29" />290-299 <option value="30" />300-309 <option value="31" />310-319 <option value="32" />320-329 <option value="33" />330-339 <option value="34" />340-349 <option value="35" />350-359 </select> </td> </tr> <tr> <td>Height:</td> <td> <select name="height"> <option value="0" />Under 5'1" <option value="1" />5'1" to 5'10" <option value="2" />5'10" and over </select> </td> </tr> <tr> <td>Activity:</td> <td> <select name="activity"> <option value="0" />Mostly Sitting <option value="1" />Mostly Standing <option value="4" />Mostly Walking <option value="6" />Mostly Physical Labor </select> </td> </tr> <tr> <td>Nursing Mom:</td> <td> <select name="nursing"> <option value="0" />No <option value="10" />Yes, Solely <option value="5" />Yes, Supplementing </select> </td> </tr> <tr><td colspan="2"><input value="Calculate" onclick="getpoints();" type="button" /></td></tr> <tr><td>POINT ALLOWANCE:</td><td><input name="dresult" type="text" /></td></tr> </tr></table> </form> </div> <p align="center">Note: Minimum Daily Points is 18, Max is 44</p></center> I want to have multiple instances of jcarousellite on the same page, but as you can see, they both scroll together. I am javascript brain dead, so any help would be appreciated, even if it's something obvious. http://goo.gl/vMLPA I found the following guide, but I need my hand held. http://myintarweb.com/dispatch/multiple-jcarouselite Ok so I have this script and I cant figure out how to add multiple star ratings to one page. PHP Code: <? require "config.php" ?> <!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="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="SMARTREVIEWSCRIPT.COM" /> <title>Add Your Review</title> <link rel="stylesheet" href="style.css" type="text/css" /> <script type="text/javascript"> <!-- var set=false; var v=0; var a; function loadStars() { star1 = new Image(12,12); star1.src = "images/staroff.gif"; star2 = new Image(12,12); star2.src= "images/staron.gif"; } function highlight(x) { if (set==false) { y=x*1+1 switch(x) { case "1": document.getElementById(x).src= star2.src; break; case "2":for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } break; case "3":for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } break; case "4":for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } break; case "5":for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } break; } } } function losehighlight(x) { if (set==false) { for (i=1;i<6;i++) { document.getElementById(i).src=star1.src; document.getElementById('vote').innerHTML="" } } } function setStar(x) { y=x*1+1 if (set==false) { switch(x) { case "1": a="1" flash(a); document.review.rating.value = '1'; break; case "2": a="2" flash(a); document.review.rating.value = '2'; break; case "3": a="3" flash(a); document.review.rating.value = '3'; break; case "4": a="4" flash(a); document.review.rating.value = '4'; break; case "5": a="5" flash(a); document.review.rating.value = '5'; break; } set=true; } } function flash() { y=a*1+1 switch(v) { case 0: for (i=1;i<y;i++) { document.getElementById(i).src= star1.src; } v=1 setTimeout(flash,200) break; case 1: for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } v=2 setTimeout(flash,200) break; case 2: for (i=1;i<y;i++) { document.getElementById(i).src= star1.src; } v=3 setTimeout(flash,200) break; case 3: for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } v=4 setTimeout(flash,200) break; case 4: for (i=1;i<y;i++) { document.getElementById(i).src= star1.src; } v=5 setTimeout(flash,200) break; case 5: for (i=1;i<y;i++) { document.getElementById(i).src= star2.src; } v=6 setTimeout(flash,200) break; } } --> </script> </head> <body> <div id="main"> <? // Stores the product sku as a session $_SESSION['sku'] = $_GET['sku']; echo "<form name='review' method='post' action='add.php?sku=".$_SESSION['sku']."'>"; ?> <table width="600" border="0"> <tr> <td><span class="style1">Name: </span></td> <td><input type="text" name="name" maxlength="32" /></td> </tr> <tr> <td><span class="style1">Review Title: </span></td> <td><input size="51" maxlength="60" type="text" name="reviewtitle" value=""/></td> </tr> <tr> <td><span class="style1">Rating: </span></td> <td> <body onload="loadStars()"> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="1" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="2" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="3" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="4" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="5" style="width:12px; height:12px; float:left;" /> <div id="vote" style="font-family:arial; color:red;"></div> <? echo '<input type="hidden" name="rating">'; ?> </body> </td> </tr> <tr> <td><span class="style1">Rating: </span></td> <td> <body onload="loadStars()"> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="1" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="2" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="3" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="4" style="width:12px; height:12px; float:left;" /> <img src="images/staroff.gif" onmouseover="highlight(this.id)" onclick="setStar(this.id)" onmouseout="losehighlight(this.id)" id="5" style="width:12px; height:12px; float:left;" /> <div id="vote" style="font-family:arial; color:red;"></div> <? echo '<input type="hidden" name="rating1">'; ?> </body> </td> </tr> <tr> <td><span class="style1">Comment: </span></td> <td><textarea name="comment" cols="57" rows="6"></textarea></td> </tr> <tr> <td></td> <td> <input type="submit" value="Submit Review" /> </td> </tr> </table> </form> </div> </body> </html> I understand how to modify the rest of the code to insert this into my database but Im not sure how to change this to allow multiple star reviews. I tried to just copy and paste and change some of the values to no avail. I contacted the seller of the script and he recommended I ask here. I appreciate any help. Thank you. Is it possible to modify the code I am using in this example to create multiple photo galleries on the same page (basically one for each horse - set up exactly like the example)? There is also some CSS that is connected to this photo gallery. I know CSS a bit more than I know javascript...which I suppose isn't really saying much, since I don't know javascript at all. Also, how much of the code should I post, considering it's a multiple parter? Many thanks! Hi i just switched over from 1.5 to 2.2 swfobject. in my admin area only the first video is showing on the page, but on the user side they all show up just fine, same code.. strange. but anyway i was reading this.. http://groups.google.com/group/swfob...1e29c96933dfa0 and it confused me alittle because i have no idea how many vids are going to be display, i have them displaying from a loop. i guess what the article is saying is that you have to call javascript for every one your going to display and use a dif label name for it. but as i said i have no clue, am i suppose to list that 100 times on the page in case i have 100 videos... javascript is really not my cup of tea lol... here is my code.. in the head i have this ... Code: <!-- added for swfobject 2.2 --> <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript"> swfobject.registerObject("player", "9.0.0"); </script and then in the body i have this.. and like i said there might be 100 vids but it only shows the first one. Code: begin the loop then do this <div style="float:left;"> <table border="0" align="left"><tr> <td align="center"><td align="center"><?=$sql_array->vid_name?><br /> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="175" height="175" id="player" name="player" align="middle"> <param name="movie" value="player.swf" /> <param name="play" value="false" /> <param name="quality" value="high" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="flashvars" value="file=<?=$CONST_LINK_ROOT?>/movies/<?=$sql_array->vid_id?>.flv" /> <!--[if !IE]>--> <object type="application/x-shockwave-flash" data="player.swf" width="175" height="175" align="middle"> <param name="play" value="false" /> <param name="quality" value="high" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <param name="flashvars" value="file=<?=$CONST_LINK_ROOT?>/movies/<?=$sql_array->vid_id?>.flv" /> <!--<![endif]--> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /> </a> <!--[if !IE]>--> </object> <!--<![endif]--> </object> </td></tr></table> </div> loop again till done... so what do i do to show multiples on a page. Hi, ok i been playing around with this for awhile now http://www.dynamicdrive.com/dynamici...iframessi2.htm could not get it to work, so i tried several others and still nada, i finally ran across http://www.codingforums.com/archive/.../t-224293.html and i worked with what old pendent had done. The result is that i got some good results, closer to what i wanted but i need to do it multiple times. It works for one but not the other. i thought about putting each iframe on a sep html page and then using two sep tables and doing a SS include. but there has to be a better way. what im doing is i have an amazon iframe and a shopzilla iframe for the same product search and i want them posted one under the other iframe iframe and expand as the size needs, alowing for either to be longer or shorter when needed. i can do one but i have not found a way to do both yet. i removed my code because it showed my personal affiliate info in the code, since i cant give you an example without showing the code i guess ill just use the auto scroll and live with it... thanks I've done extensive searching, but each example or explanation i come across is too different from my own, so it's ultimately no use. The problem is that I barely know anything when it comes to Javascript, but yet I'm trying to use it. I have a form on a page. This form contains 6 <select> elements, each with its own <option>Other</option> element. If something isn't listed, the user can choose "Other" and then type into a textbox which appears. I have the following code, which works great if only applied to one <select> element. Code: <select name="How did you hear about us?" id="How did you hear about us?" onchange="makeBox1()"> <option value="0" selected="selected">-- Select --</option> <option value="1">Search Engine</option> <option value="2">Referral</option> <option value="3">Trade Publication</option> <option value="4">Vendor Web Site</option> <option value="5">Your Company Website</option> <option value="6">Direct Mail</option> <option value="7">Other</option> </select> <div id = "inputBox1"></div> <script type = "text/javascript"> function makeBox1() { var a = "<input type = 'text' name = 'box1' id = 'box1' class='form popup'>" if (document.getElementById("How did you hear about us?").value==7) { document.getElementById("inputBox1").innerHTML = a; } else { document.getElementById("inputBox1").innerHTML = ""; } } </script> I've read that you have to combine onchange events, but i have no idea how to do this (i've done plenty of trial and error, trying to make every item unique, but to no avail. How would i add more scripts like the above? Basically, I have a total of three different JavaScripts that need to be loaded when the user opens the page; let's call them script_a.js, script_b.js, and script_c.js script_a.js and script_b.js each need to be loaded on every page; however, they do very different things (one displays text, the other creates buttons), and in the interest of readability and ease of editing later, I want to keep them separate. script_c.js only needs to be loaded on one page; there will be a few variants (script_c2, script_c3, etc), but again, each of them only needs to be loaded on a single page. The scripts are also too large and unwieldy for me to put them directly into the HTML (basically because I have to do a lot of different switches, and conditionals, and output formatting). At present, the only way I know how to load a JavaScript is to use window.onload, so obviously I'm getting into the issue of competing onLoads. Any help would be appreciated! I use this tooltip script on my site: http://craigsworks.com/projects/simpletip/ The problem is that I have several links in the same div class and I want to load different content in tooltip when the mouse is over different links. This is the code I use to load tooltip: Code: $(document).ready(function(){ // Create your tooltips var api = $(".ttip a").simpletip().simpletip(); api.load('include.php'); }); This is the HTML code: Code: <div class="ttip"> <a userid="1" href="#" >user1</a><br /> <a userid="2" href="#">user2</a> </div> Now the tooltip works only for the first link. For the second one only some default text is shown instead when I hover it! Can anyone please help? I'm trying to create a portfolio website in which I have multiple galleries showing different work on the same page . Each to work separately and change the default image on click. I have seen it work he http://www.fajnechlopaki.com/ I was able to follow this: http://codingforums.com/showthread.php?p=941419 but then couldn't duplicate it. Please help! Thanks. Im using the following script: Code: <script type="text/javascript"> function unhide(hiddentext) { var item = document.getElementById(hiddentext); if (item) { item.className=(item.className=='hidden')?'unhidden':'hidden'; } } </script> <style type="text/css"> .unhidden { display: block; } .hidden { display: none; } </style> to hide and unhide a block of text on my page, using onclick events. the problem is its not allowing me to use it multiple times in a page. when i use a second instance of it, both stop working. the above demonstrated script is working with the following elements: middle (approx) of page: Code: <td class="desc_cell"><strong>Download Station</strong><br /> 17" Macbook Pro<br /><a href="javascript:unhide('itemlist');" onclick="changeText(this,'Hide Item List');" id="text1link"]Old Text>Click Here For Full Item List</a><div id="hiddentext" class="hidden">list of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes herelist of items goes here</div> </td> bottom of page: [code]<p align="center" style="citylist">Allen Park MI, Anchor Bay Gardens MI, Anchor Bay Harbor MI, Anchor Bay Shores MI, Andersonville MI,<a href="javascript:unhide('hiddentext');" onclick="changeText(this,' View Less...');" id="text1link"]Old Text>View More...</a></p><div id="hiddentext" class="hidden">Armada MI, Auburn Heights MI, Auburn Hills MI, Austin Corneorth Farmington MI, Northville MI, Norton MI, Novi MI, Oak MI, Oak Grove MI, Oak Park MI, Oakley Park MI, Oakwood MI, Orchard Lake MI, Ortonville MI, Oxbow MI, Oxford MI, Perry Lake Heights MI, Pleasant Ridge MI, Plymouth MI, Point Lakeview MI, Pontiac MI, Preston Coom MI, Wolcott Mills MI, Wolverine Lake MI, Wood Creek Farms MI, Woodhaven MI, Wyandotte MI, Yates MI, and many more!</div> Hi, When designing a web page, you may come across a situation where you want to combine content from multiple websites in a single window. Could the "iframe" tag makes this possible? If so, as it will separate your page design into several sections and display a different website in each one? Your answers are much appreciated. Thank you for watching me. Stickers Hi. I am trying to set up a photo gallery on a website using the Galleria Javascript. I managed to setup one gallery but I don't know the code to setup another or another two galleries on the same one page. Can anyone help me urgently? When I try to post the code twice, it gives an error message. The java script code is below: Code: <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> <script src="galleria/galleria-1.2.5.min.js"></script> </head> <body> <div align="center"> <div id="gallery"> <img alt="Admin team." src="http://www.raisingsistersconference.info/galleria/themes/classic/images/photo1.jpg" /> <img alt="Ladies In Session!" src="http://www.raisingsistersconference.info/galleria/themes/classic/images/photo2.jpg" /> <img alt="Ladies in Worship." src="http://www.raisingsistersconference.info/galleria/themes/classic/images/photo3.jpg" /> </div></div> <script> Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js'); $("#gallery").galleria({ width: 540, height: 540 }); </script></div> </body> </html> I am still new to programming and so have no idea in how to adapt this script to make two or three galleries on the same page. The website address is: http://www.raisingsistersconference....togallery.html Thanks so much. |