JavaScript - Combining Tabs & Faq
Similar TutorialsHello all, I've been banging my head against a wall for the past few days trying to figure out why when I add another script to my page the old one stops working. Finally I found the answer, but due to still being extremely new to javascript - and coding in general - I have not been able to successfully combine the two scripts that I have. I know it is very simple, so would someone mind either walking me thru it, or just giving me an end product to see where I was going wrong? I would really appreciate any input! The two scripts I have are Nivo slider Code: <script type="text/javascript"> $(window).load(function() { $('#slider').nivoSlider({ effect: 'random', // Specify sets like: 'fold,fade,sliceDown' }); }); </script> Nav menu plugin Code: <script type="text/javascript"> $(document).ready(function () { $('#nav li').hover( function () { //show its submenu $('ul', this).slideDown(500); }, function () { //hide its submenu $('ul', this).slideUp(300); } ); }); </script> Using this: Code: clip.addEventListener( 'onMouseDown', my_mouse_down_handler ); function my_mouse_down_handler(client) { alert( "mouse button is down" ); } How can integrate this jQuery function so that the quick-alert div is displayed instead of alert( "mouse button is down" ); ? Code: $(document).ready(function() { $('#show-alert').click(function() { $('<div class="quick-alert">Alert Message</div>') .insertAfter($(this)) .fadeIn('slow') .animate({opacity: 1.0}, 3000) .fadeOut('slow', function() { $(this).remove(); }); }); }); I basically have 2 "if" statements. How would i go about combining them? Code: function validate_form(thisform) { with (thisform) { if (validate_required(name,"Name is required to continue")==false) {name.focus(); name.style.border='2px solid red'; return false;} } } function validateForm(){ if(document.start_flyer.prop_id.selectedIndex==0) { alert("Please select an Item."); document.start_flyer.prop_id.focus(); return false; } return true; } Code: <form action="/flyer/create" name="start_flyer" method="post" onsubmit="return validate_form(this)" > Thanks for any help! I have this function which rounds up the <p>s, checks their ids, twice, for specific letter combinations and, depending on the combination, changes the class name in one of two ways. It's referencing <p> tags with ids that look like this: <p id="Labaabb6"> , where 'a' could be 'b' & vice versa, '6' any number from 1 to 6, and 'L' is just there to be zero in the character count. Still here? OK, there are six variations, V1() to V6(): these work standalone, but it'd be good to combine them. This is where I'm having some trouble... Here's a breakdown of the first function: Code: Line 1 function V1(){ 2 for (i=0; i<elP.length; i++) { 3 if(elP[i].id.charAt(1)=='a' && elP[i].id.charAt(7)=='1') { 4 elP[i].className = 'oV1'} 5 else if(elP[i].id.charAt(1)=='b' && elP[i].id.charAt(7)=='1') { 6 elP[i].className = 'xV1'} }} In Lines 3 and 5, the value of elP[i].id.charAt(7) is a variable: it can be '1' to '6', and is always the same value in both lines. In Line 3 elP[i].id.charAt() is a variable, could be (1) to (6), always == a. In Line 5 elP[i].id.charAt() is a variable, could be (1) to (6), always == b. In Line 4, elP[i].className is a variable, could be one of a set of six. In Line 6, elP[i].classNam e is a variable, could be one of a different set of six. For a start, how many variables? I make it three. elP[i].id.charAt(); elP[i].id.charAt(7); or maybe wrapped into 'elP[i].id.charAt()' ? elP[i].className. First draft, don't fully understand how to write variables: function V(charNo, lnNo, newC) { var charNo = elP[i].id.charAt() or elP[i].id.charAt[] ? var lnNo = elP[i].id.charAt(7) var newC = elP[i].className for (i=0; i<elP.length; i++) { do if/else here} } Any help appreciated. I am throughly confused....why does this seemingly simple deal not work? Code: <script type="text/javascript"> <!-- window.onbeforeunload = function (){ var checkboxImg = new Image(); var checkboxImgUrl = "checkbox.php%3Flonger%3D" + reviews-chk-longer.checked + "%26discrete%3D" + reviews-chk-discrete.checked + "%26natural%3D" + reviews-chk-natural.checked + "%26thicker%3D" + reviews-chk-thicker.checked + "%26permanent%3D" + reviews-chk-permanent.checked + "%26stamina%3D" + reviews-chk-stamina.checked + "%26harder%3D" + reviews-chk-harder.checked + "%26vascularity%3D" + reviews-chk-vascularity.checked + "%26drive%3D" + reviews-chk-drive.checked + "%26guarantee%3D" + reviews-chk-guarantee.checked + "%26trials%3D" + reviews-chk-trials.checked + "%26affordable%3D" + reviews-chk-affordable.checked; alert(checkboxImgUrl); checkboxImg.src = checkboxImgUrl; } // --> </script> I get no alert when I do this....however the same thing without all of the added strings works fine, ie: Code: <script type="text/javascript"> <!-- window.onbeforeunload = function (){ var checkboxImg = new Image(); var checkboxImgUrl = "checkbox.php"; alert(checkboxImgUrl); checkboxImg.src = checkboxImgUrl; } // --> </script> Can anyone please help? I tried using .concat and that didn't help either Hello everyone! I'm trying to use Shadowbox with an Image Gallery on my page, and both are working except for this little thing: Both work fine by themselves on the same page: I have a clickable "contact me" button that brings up my contact page in a Shadowbox, and I have an Image Gallery that is working fine. My problem is that I want to make my images in the Image Gallery also bring up a Shadowbox box when clicked. I tried to use the same (a rel="shadowbox;width=...;height=..." href="...") in the anchor tags of the images, but when I click an image, the link loads over the page, not in a Shadowbox while it works perfectly on the contact button It doesn't look like a Javascript conflict because each one is working, just not in that particular situation. Please can someone help me sort this out! You can preview my page from he http://dl.dropbox.co...eshow/Home.html And save it from he http://dl.dropbox.co...y-slideshow.zip The slideshow is a "mootools qscroller" (included). Please help me out! I'll be very grateful! <3 <3 :* I want to call both of these functions with the same "onclick". Right now the two html onclicks that call each of these are below onclick="changeIt({IMAGE_VALUE_LOOP})" onclick="return toggleDiv('preview')" (where preview is the id of the div) Code: function changeIt() { var theImg = document.getElementsByTagName('img')[0].src; var x = theImg.split("/"); var t = x.length-1; var y = x[t]; } function toggleDiv(a){ var e=document.getElementById(a); if(!e)return true; if(e.style.display=="none"){ e.style.display="block" } else { e.style.display="$div" } return true; } Hello, Hello, I am new to javascript. I want to combine those two scripts in one, but unfortunately I cannot do this by myself. The main idea is to take a random youtube link and put it on the player so my website users can watch a random youtube video when they refresh the page. If there is someone who can help me with this problem, I will be really thankful. The two codes that I am strangling with are at the end of this post. Thanks in advance. Code number one (Random Text Display) Code: <script language='JavaScript'> var r_text = new Array (); r_text[0] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[1] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[2] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[3] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[4] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[5] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[6] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; var i = Math.floor(7*Math.random()) document.write(r_text[i]); </script> The second code (JW Player) Code: <script type='text/javascript'> jwplayer('myElement').setup({ file: 'TUK', width: 290, }); </script> Reply With Quote 01-08-2015, 08:17 PM #2 Philip M View Profile View Forum Posts Supreme Master coder! Join Date Jun 2002 Location London, England Posts 18,371 Thanks 204 Thanked 2,573 Times in 2,551 Posts Just put the two scripts within the same set of script tags. Note that <script language='JavaScript'> is long obsolete. Code: <script type = "text/javascript"> jwplayer('myElement').setup({ file: 'TUK', width: 290, var r_text = new Array (); r_text[0] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[1] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[2] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[3] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[4] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[5] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; r_text[6] = 'https://www.youtube.com/watch?v=r3k4TopCrS4'; var i = Math.floor(7*Math.random()) document.write(r_text[i]); </script> This is the first function. Code: <html> <head> </head> <body> <script language="javascript" type="text/javascript"> function getthat****(){ num_a=Number(document.addition.entry_1.value); num_b=Number(document.addition.entry_2.value); num_c=Number(document.addition.entry_3.value); num_d=Number(document.addition.entry_4.value); num_e=Number(document.addition.entry_5.value); valNum1=num_a*num_c valNum2=num_a*num_d valNum3=num_b*num_c valNum4=num_b*num_d valNum5=valNum1-valNum4 valNum6=valNum2+valNum3 valNum7=num_e/Math.sqrt(3) valNum8=valNum7+valNum1-valNum4 document.addition.endVal1.value=valNum8; document.addition.endVal2.value=valNum6; } </script> <form name="addition"> <br> impedance (rectangular) <input type="text" name="entry_1"> + j <input type="text" name="entry_2"> ohms <br> <br> line current (rectangular) <input type="text" name="entry_3"> + j <input type="text" name="entry_4"> amperes<br><br> <br> <br> line value of receiving voltage <input type="text" name="entry_5"> volts (angle is zero degrees) (reference) <br> <br> (<input type="text" name="endVal1"> + j <input type="text" name="endVal2">) Volts <br> <input type="button" value="Product" onclick="getthat****()"> <input type="reset" value="Clear"> </form> </body> </html> And this is the second one. Code: <html> <head> </head> <body> <script language="javascript" type="text/javascript"> function PolarConvert(){ num_1=Number(document.addition.entry_1.value); num_2=Number(document.addition.entry_2.value); valNum1=Math.pow(num_1,2); valNum2=Math.pow(num_2,2); valNum3=Math.sqrt(valNum1 + valNum2); valNum4=Math.atan(num_2/num_1); valNum5=(valNum4*180)/Math.PI; document.addition.endVal.value=valNum3; document.addition.endVal2.value=valNum5; } </script> <form name="addition"> <input type="text" name="entry_1">+ j <input type="text" name="entry_2"> = <input type="text" name="endVal"> angle <input type="text" name="endVal2"><br> <input type="button" value="Convert to polar" onclick="PolarConvert()"> <input type="reset" value="Clear"> </form> </body> </html> The question is how do I combine these given that the value that would be computed in function 2 is already computed in function 1 ? Thanks a lot !!! I am trying to set a PHP variable but am using the onClick() event handler, which requires JavaScript. See below: [ICODE]<a href="javascript:update('gallery/Fgallery1-1.jpg', 0);" onClick="index_value = 'gallery1-1';"> <img src="gallery/gallery1-1.jpg" alt="Antique Impressions Hardwood Flooring - White Oak" border="0" class="galborders" onMouseOver="alert_msg('Click to view image close up')" onMouseOut="away()"></a><br /></ICODE] The webpage is http://www.hardwood-floor-products.com/gallery1.php. What I am trying to do is to set up a PHP variable, $index, that is equal to "gallery1-1', 'gallery1-2', etc. so that I can use that varialble throughout this module. I also realize that I need to use JavaScript with onClick() but I have had no success. I realize that PHP is servier-side and JavaScript is client-side, but there must be a way to do that. Genia I have 2 different scripts which works fine by them self, but now I need to combine them, and don't know how... The first script is populating dependent selectboxes like this: Code: function getXMLHTTP() { //fuction to return the xml http object var xmlhttp=false; try{ xmlhttp=new XMLHttpRequest(); } catch(e) { try{ xmlhttp= new ActiveXObject("Microsoft.XMLHTTP"); } catch(e){ try{ xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e1){ xmlhttp=false; } } } return xmlhttp; } function getState(countryId) { var strURL="js/searchRoundState.php?ccountry="+countryId; var req = getXMLHTTP(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { // only if "OK" if (req.status == 200) { document.getElementById('statediv').innerHTML=req.responseText; document.getElementById('citydiv').innerHTML=req.responseText; } else { alert("There was a problem while using XMLHTTP:\n" + req.statusText); } } } req.open("GET", strURL, true); req.send(null); } } function getCity(countryId,stateId) { var strURL="js/searchRoundClub.php?ccountry="+countryId+"&cstate="+stateId; var req = getXMLHTTP(); if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { // only if "OK" if (req.status == 200) { document.getElementById('citydiv').innerHTML=req.responseText; } else { alert("There was a problem while using XMLHTTP:\n" + req.statusText); } } } req.open("GET", strURL, true); req.send(null); } } function getCourse(countryId,stateId,courseId) { var strURL="js/searchRoundCourse.php?ccountry="+countryId+"&cstate="+stateId+"&ccourse="+courseId; var req = getXMLHTTP(); document.getElementById('coursediv').innerHTML ='<center><br><br><img src="images/ajax-loader3.gif"><br><br><br></center>'; if (req) { req.onreadystatechange = function() { if (req.readyState == 4) { // only if "OK" if (req.status == 200) { document.getElementById('coursediv').innerHTML=req.responseText; } else { alert("There was a problem while using XMLHTTP:\n" + req.statusText); } } } req.open("GET", strURL, true); req.send(null); } } It gets the data from the selectfiled like this: Code: <select id="ccountry" onchange="getState(this.value);getCourse(this.value)" class="input_field"> <option value="1" selected>Test1</option> <option value="2" selected>Test2</option> </select> Now the other script is a ajax script which loads the page and gets called like this: Code: <select id="ccountry" onchange="ajaxcombo(\'ccountry\', \'contentarea\');" class="input_field"> <option value="ajax.php?ga=roundsearch&id=1" selected>Test1</option> <option value="ajax.php?ga=roundsearch&id=2" selected>Test1</option> </select> As you can see, the ajax part is called using a url and the selectpart is called by Value... Is there a way that the slectpart could be using the url instead af an "id"... Thanks in advance... I would like to fill a text field using both text and variables.. i.e. it would say x+2, so i would write.. (if 2 were a given variable) form.form1.value = "x+" 2 ??? (I know that isn't correct, I'm just wondering how I would go about this..) Doing a bit of window-opening: the idea is, when a link is clicked, it selects a random one from an array of urls, and then opens it with certain toolbars missing. Got a script for each part, but not sure how to combine them: ' location ' seems to be talking about different things in each script. the random script: Code: var single = new Array ("a.htm","b.htm","z.htm") function choose(){ window. location =choose[Math.floor(Math.random()*single.length)] } the opener script: Code: function open() { window.open('myurl',' location =no,toolbar=1, directories=no,status=no,menubar=no,resizable=yes,scrollbars=yes') } Any suggestions? (No comments plz about removing toolbars: still experimenting, and the viewer won't be left stranded). I would like to take a series of images and paste them into a final larger image before displaying it to the user. From what I've read there are libraries that use HTMLcanvas that could achieve this but they don't work even with newer versions of IE. I was wondering if there were functions similar to the PHP image editing functions that work with newer versions of IE? Cheers. I've created a single form with multiple buttons. I am now attempting to have a couple of these buttons open a new window when clicked. The new window opens fine but the original browser window keeps opening to an [object Window] page. I believe this is because it is not reading the "return false" correctly but I am not sure how to fix this. Code: function invoke(btn) { if(btn == 0) document.Lockdate.action="Button1.php"; if(btn == 1) document.Lockdate.action="window.open('Button2.php'); return false;" document.Lockdate.submit(); } And then here is the code for the buttons themselves: Code: <input type="button" value="Button1" onclick="invoke(0)"> <input type="button" value="Button2" onclick="invoke(1)"> Hi, I've found this forum a really useful resource for solving my JS queries I've had in the past, but up until now I've never needed to post. Over at my personal tumblog, http://andbamnan.tumblr.com, I have implemented both 'J' 'K' key navigation (on Chrome and Safari only) and infinite scrolling. However, I've found that the two scripts don't work so harmoniously together, as the key navigation from post-to-post doesn't go beyond the first page, instead scrolling up to the first post of the first page. Chrome or Safari users can experience what I'm trying to describe by clicking on the link above and hitting 'J' to browse down or 'K' to browse up. I hope there is a solution for this, or if possible, a script out there that CAN conquer both commands. Thank you Hello, First of all, I am not a coder. I can put together some fairly simple HTML, and can borrow chunks of JS code to suit certain basic purposes. Also, I am terribly sorry if my technical lingo is way off target. I have managed to accomplish two separate goals using javascript, but am having trouble combining their results. I have created an image link that randomly calls a URL from an array. I also have a separate roll-over image. What I am trying to do is have the link that accesses the array also be a roll-over image. I can't seem to accomplish this. http://matrix.senecac.on.ca/~mlinhar...low/page7.html This URL is what I am working on. The "b" symbol is the roll-over. The "right" arrow accesses an array at: http://matrix.senecac.on.ca/~mlinhar...w/randomize.js I have tried simply adding my roll-over code to randomize.js and adjusting the array accordingly, but that doesn't seem to work. I would like the "right" arrow to be a roll-over image as the "b" symbol is, but also access the "randomize" array as it currently does. My problem is that my understanding of JS isn't great enough to determine how separate pieces of code might be combined or function together. Anyways, I'm sorry if my technical knowledge and abilities are too underdeveloped for this forum. I would appreciate any and all advice anyone might have. I am try to reduce the time taken to download my home page. I purchased a template and then just modified what I wanted. There is a script that calls 21 other scripts. I am told if I combined all this scripts into one or two scripts, my download time would go down. Help appreciated. Drachsi www.drachsi.com Hi everyone I'm having a hard time, wrapping my head around an array sort+combine function. I have an array which would look somewhat (these are simplified numbers) like this Code: TestArray = [ ["222222","1"], ["222222","1"], ["222222","1"], ["333333","1"] ["111111","1"], ["000000","2"], ["111111","2"], ["111111","2"], ["222222","20"], ]; I got it as far as to be sorted like this: Code: SortedArray = [ ["000000","2"], ["111111","1"], ["111111","2"], ["111111","2"], ["222222","1"], ["222222","1"], ["222222","20"], ["222222","1"], ["333333","1"] ]; And from there to this: Code: BadlyMergedArray = [ ["000000","2"], ["111111,"1","2"], ["222222","1","20","1"], ["333333","1"] ]; But I want to end up with this: Code: MergedArray = [ ["000000","2"], ["111111","1","2"], ["222222","1","20"], ["333333","1"] ]; So the first part of the inner arrays is the first item to be sorted and combined by. After that, the smaller numbers have to do practically the same, while staying in the correct order under the first sort. I'm only a spare time programmer, and my code is probably one of the most confusing pieces of code ever written. I am assuming that this is some fairly easy stuff for one of you guys. I can post my code, but I think there's a much easier solution to it, so I wanted to see if someone can point me in the right direction, or show me how this is properly done. Thanks so much! here's to hoping! patrick/shootingpandas |