JavaScript - Javascript Help Desperately Needed (tabbed Menu)
Hey everyone! This is my first post, so let me go ahead and say hey to everyone at the forums. I myself don't know a whole lot about programming/coding, but I do run my business completely off the internet so I'm not clueless. I have a firm grip on HTML, and I can edit CSS files usually whenever I need to. All my sites use Wordpress now anyway, so there's rarely any need to check or edit the code.
Anyways, to my dilemma. I basically have an old website of my own (http://www.knowtheirbackground.blogspot.com). It's a pretty old site I hosted on Blogger, and if anyone is familiar with Blogger it's pretty simple. I downloaded that theme from a site and since all Blogger themes are XML I never really looked at the code. Basically, I want to have a menu like you see on the right of the site I linked you to. A tabbed javascript menu (from what I looked at of the code recently I thought the menu was pretty much made using javascript and css). I've tried Googling and Bing-ing and yahoo-ing tutorials to make a tabbed menu and haven't been successful yet. I want one that operates just like the one on Know Their Background, only things I would change is the text and maybe the colors. I've looked and tried for days and have been unsuccessful. Any help I would GREATLY appreciate. P.S. I also tried using jQuery or something along those lines and nothing. Tried some wordpress plug ins too but they only work in widgets when they do work.. I want my menu in a sticky post on the front page. Similar Tutorialshi guys , i'am new here and need some help from you , well it's been 3 weeks that i bought script os host sharing picture from indian company well my fault i'didnt dig well the demo script, i discrovred that it was very buggy on IE8 , i tired to contact them and we exchanged like 80 email's and everyday they say the fix is coming soon , tomrrow, dont worry, now they not answering anymore. so i'am calling your help here to fix the bugs wich are mainly js Exemple under IE8 when i download the picture it's work fine but when i push button add the picture i got blank page with word on top 'flashupload' the download work fine on Firefox but not on IE8 thank's to all See below:
I found a menu I really like at the top of the page at www-dot-sachscreative-dot-com but can't figure out how it works from the source code. Can someone tell me how to make something like it which is browser independent and uses javascript and/or CSS? It's been years since I did javascript work and I've forgotten must of what I used to know. Thanks.
Dear all, Below are my current script. I need another few more sets of the triple drop down menu same as the below script... (Scenario: creating like a online shopping order form, where customers can have multiple orders.) Please guide me how to do so.. Thank you in advance. <script type="text/javascript"> /* Triple Combo Script Credit By Philip M: http://www.codingforums.com/member.php?u=186 Visit http://javascriptkit.com for this and over 400+ other scripts */ var categories = []; categories["startList"] = ["Wearing Apparel","Books"] categories["Wearing Apparel"] = ["Men","Women","Children"]; categories["Books"] = ["Biography","Fiction","Nonfiction"]; categories["Men"] = ["Shirts","Ties","Belts","Hats"]; categories["Women"] = ["Blouses","Skirts","Scarves", "Hats"]; categories["Children"] = ["Shorts", "Socks", "Coats", "Nightwear"]; categories["Biography"] = ["Contemporay","Historical","Other"]; categories["Fiction"] = ["Science Fiction","Romance", "Thrillers", "Crime"]; categories["Nonfiction"] = ["How-To","Travel","Cookbooks", "Old Churches"]; var nLists = 3; // number of select lists in the set function fillSelect(currCat,currList){ var step = Number(currList.name.replace(/\D/g,"")); for (i=step; i<nLists+1; i++) { document.forms['tripleplay']['List'+i].length = 1; document.forms['tripleplay']['List'+i].selectedIndex = 0; } var nCat = categories[currCat]; for (each in nCat) { var nOption = document.createElement('option'); var nData = document.createTextNode(nCat[each]); nOption.setAttribute('value',nCat[each]); nOption.appendChild(nData); currList.appendChild(nOption); } } function getValue(L3, L2, L1) { alert("Your selection was:- \n" + L1 + "\n" + L2 + "\n" + L3); } function init() { fillSelect('startList',document.forms['tripleplay']['List1']) } navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false); </script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> </head> <body> <form name="tripleplay" action=""> <select name='List1' onchange="fillSelect(this.value,this.form['List2'])"> <option selected>Make a selection</option> </select> <select name='List2' onchange="fillSelect(this.value,this.form['List3'])"> <option selected>Make a selection</option> </select> <select name='List3' onchange="getValue(this.value, this.form['List2'].value, this.form['List1'].value)"> <option selected >Make a selection</option> </select> </form> </body> </html> Hello, I have a specific need in javascript. Can I be guided in this context if its possible or not??? I am using virtuemart extension in joomla to make an ecommerce website. I will try to explain my requirement with the example. Following is the sample category tree with number. 1.0 .....1.1 ..........1.1.1 ..........1.1.2 .....1.2 ..........1.2.1 ..........1.2.2 .....1.3 ..........1.3.1 ..........1.3.2 2.0 .....2.1 ..........2.1.1 ..........2.1.2 .....2.2 ..........2.2.1 ..........2.2.2 .....2.3 ..........2.3.1 ..........2.3.2 Now I have a drop down main menu as 1.0 and 2.0. I want that when i click on 1.0 all the nodes of 1.0 should be opened and 2.0 should be closed and similarly when i click on 2.0 all its child nodes should be opened and 1.0 should be closed. What happen with most extensions is that at a time only one child is opened. If i click on 1.0 then only 1.1 or 1.2 or 1.3 will remain open at a time. Does this kind of customization can be done or is available in javascript .... I hope i will be helped... Thanks a lot for the time. Hello all, Firstly apologies for my javascript ignorance - I'm not a programmer, just someone thrust into programming since there's no-one else at my company who can do it. I found a nice js script online for a drop-down menu where the drop downs both expand to their full size and fade-in (very quickly) from transparent. The script in action can be seen on the script writer's site he http://sandbox.leigeber.com/dropdown-menu/index.html and the script is: Code: var menu=function(){ var t=15,z=50,s=6,a; function dd(n){this.n=n; this.h=[]; this.c=[]} dd.prototype.init=function(p,c){ a=c; var w=document.getElementById(p), s=w.getElementsByTagName('ul'), l=s.length, i=0; for(i;i<l;i++){ var h=s[i].parentNode; this.h[i]=h; this.c[i]=s[i]; h.onmouseover=new Function(this.n+'.st('+i+',true)'); h.onmouseout=new Function(this.n+'.st('+i+')'); } } dd.prototype.st=function(x,f){ var c=this.c[x], h=this.h[x], p=h.getElementsByTagName('a')[0]; clearInterval(c.t); c.style.overflow='hidden'; if(f){ p.className+=' '+a; if(!c.mh){c.style.display='block'; c.style.height=''; c.mh=c.offsetHeight; c.style.height=0} if(c.mh==c.offsetHeight){c.style.overflow='visible'} else{c.style.zIndex=z; z++; c.t=setInterval(function(){sl(c,1)},t)} }else{p.className=p.className.replace(a,''); c.t=setInterval(function(){sl(c,-1)},t)} } function sl(c,f){ var h=c.offsetHeight; if((h<=0&&f!=1)||(h>=c.mh&&f==1)){ if(f==1){c.style.filter=''; c.style.opacity=1; c.style.overflow='visible'} clearInterval(c.t); return } var d=(f==1)?Math.ceil((c.mh-h)/s):Math.ceil(h/s), o=h/c.mh; c.style.opacity=o; c.style.filter='alpha(opacity='+(o*100)+')'; c.style.height=h+(d*f)+'px' } return{dd:dd} }(); with Code: var menu=new menu.dd("menu"); menu.init("menu","menuhover"); used on my html page to call the script. I'm using the script exactly as written and exactly as it is on the dude's demo page for it. However, some of my sub-menu items are wider than their parent items and in IE7 this means they are bound to the width of the parent until the animations have finished, and then pop-out to their full width (NB not an issue in FF3). I'm actually not too fussed about either the fade in or expand out effects (they'd be nice, but not at the expense of the IE7 bug) so I simply wanted to know what I should do to the script to turn off the effects, or make them instant - ie reduce the length of the effect to as short as possible. I understand I can get rid of the bug by specifying a width for the ul element in my css, but I'd rather not do that if I can help it. I'd appreciate anyone's insight on this. Thanks Tom Hi Guys, Im in need of some help with regards to forms. I am looking to build as basic as possible, a form that has 3 select dropdowns that have predetermined options. The user will select the first option and based on that option the second will populate and based on that, the third one will give the last option. Now, when the last one is selected, i need a div or a paragraph displaying information to be displayed. So here's the framework. Option 1 = fruit or vegitables of which fruit is selected is selected by the user Option 2 = Apples, Grapes, and pears of which apples is then selected Option 3 = Red, Green and Yellow of which Green is selected. Once green is selected, I need a description about the green aple to be displayed. Can anyone help me out on this? I am not sure where to begin and my boss is adament it must be done like yesterday. Ay help will be appreciated. Thanks. hello everyone im coding a website at the moment using aspx and i have came to a snag. im trying to make a dropdown list which is populated by an array call my chaletDetails.aspx page - each item in the array will be directed to this page. ive diffled abit, but the more i do the more im afraid of breaking something lol. if someone could maybe look at the code and show me how this could be achieved id appriciate it very much. The code i have for my dropdown list is as follows... this is in divResorts.js var resorts = new Array("Adelboden", "Auron", "Oppdal", "Las Lenas", "La Pierre St Martin", "Val Ceneis", "Les Menuires", "Champex-Lac", "Puy St Vincent"); function populateSelectList() { var mystring = document.getElementById('divResort').innerHTML mystring += "<h4>Our Resorts</h4><select name='resorts'>" mystring += "<option>Choose a Resort</option>" for (i = 0; i < resorts.length; i++) { mystring += "<option value='" + resorts[i] + "'>" mystring += resorts[i] + "</option>" } mystring += "</select>" mystring += "<h4>Our Chalets</h4>" document.getElementById('divResort').innerHTML = mystring } within the body i have this called as: <div id="divResort"> <script type="text/javascript">populateSelectList();</script> </div> Pretty pretty please help me with this I am running out of time and pulling my hair out with this whole thing. Thanks a million in advance! Rhonda <!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=utf-8" /> <title>Untitled Document</title> <script> function numberGuess() { stringVar=prompt("Enter your guess number"); while (stringVar<999) { } } </script> <script> function enterNames() { stringVar=prompt("Enter name"); } </script> <script> function enterProducts() { stringVar=prompt("Enter product name"); return } </script> </head> <body> <p> </p> <h1>WDV221 Intro Javascript</h1> <h3 align="center">Javascript Loops</h3> <p>Topics: loops, for loops, while loops, sentinels!</p> <p>Place all script code on this page.</p> <p>1. Create a function that will ask you for a number until you enter 999 which will end the loop. You do not need to display the number. </p> <p>2. Create a function that will ask you for a name until you tell the function that you do not have any more names. After you enter each name it will ask you if you have more names to enter. If you enter yes the process will continue. Display each name at the end of the following sentence.</p> <p>The name you entered is: </p> <p>3. Create a runtime script that will use a prompt( ) to accept how many products will be displayed. Use a for loop to display "Product Name" and the product number as a <p> element.</p> <p><strong>Example output:</strong></p> <p>Product Name 1</p> <p>Product Name 2</p> <p>...</p> <p>4. Create a runtime script that will use a nested for loop to create a table with 3 rows and 5 cells. Place the same number or a letter in each cell. </p> <p>Hint: Write a table in HTML. Do a row first then do multiple rows. </p> <p>5. Create a function called totalSales( ) that will ask the user to enter an amount until you enter "done". Add those amounts together and display them in an alert when the user is done entering amounts..</p> <p>Have fun!!</p> </body> </html> How to create a popup blocker with javascript? I am looking for solution to open Enquiry form [Ex: send-query.php] through javascript linking. How can I do that? And how to display a popup blocker message like in the attached file? This is the url of my pop up image: http://www.rhapsody.com/thompson-squ...mpson-square-2 [When you click on play button then if you have popup blocker enabled you will get popup blocker message from the site] I have a script that works good, but it says undefined underneath, this must mean an error. But I cant work out how to get rid of it. This is the html it is a transistional XHTML doc type. Code: <div id="slidedom"> <script type="text/javascript" src="js-files/slider.js"></div></script> Then I have the js file which I will have to post all of as I am not sure of the error bit. Code: var variableslide=new Array() //variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"] variableslide[0]=['images/sign-1.gif'] variableslide[1]=['images/sign-3.gif'] variableslide[2]=['images/sign-4.gif'] //configure the below 3 variables to set the dimension/background color of the slideshow var slidewidth='188px' //set to width of LARGEST image in your slideshow var slideheight='60px' //set to height of LARGEST iamge in your slideshow, plus any text description var slidebgcolor='#FFF' //configure the below variable to determine the delay between image rotations (in miliseconds) var slidedelay=3000 ////Do not edit pass this line//////////////// var ie=document.all var dom=document.getElementById for (i=0;i<variableslide.length;i++){ var cacheimage=new Image() cacheimage.src=variableslide[i][0] } var currentslide=0 function rotateimages(){ contentcontainer='<center>' if (variableslide[currentslide][1]!="") contentcontainer+='<a href="'+variableslide[currentslide][1]+'">' contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">' if (variableslide[currentslide][1]!="") contentcontainer+='</a>' contentcontainer+='</center>' if (variableslide[currentslide][2]!="") contentcontainer+=variableslide[currentslide][2] if (document.layers){ crossrotateobj.document.write(contentcontainer) crossrotateobj.document.close() } else if (ie||dom) crossrotateobj.innerHTML=contentcontainer if (currentslide==variableslide.length-1) currentslide=0 else currentslide++ setTimeout("rotateimages()",slidedelay) } if (ie||dom) document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>') function start_slider(){ crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub if (document.layers) document.slidensmain.visibility="show" rotateimages() } if (ie||dom) start_slider() else if (document.layers) window.onload=start_slider I have taken out the credit, as I have changed it a bit, but will reinstate it later on. All I really need to know is how to define it in the XHTML maybe. Can anyone help? new to JavaScript, simple question... question: how do i determine an output from a prompt to be bold? e.g. a user enters "hello" and the output printed from the prompt becomes bold one=parseFloat(prompt('enter number',0.bold)); I'm working very hard to create a dynamic web-site for use in the education sector using server-side php/MySQL and client-side HTML with javascript. I have a logon page (index.php) which looks to see if the cookie 'mylogon' is set with the value 'Again'. This cookie is set when the PHP element on the server detects an invalid username/password combination. If so I have a javascript function (see below) call from the HTML <body onload="check_invalid_user()"> I know that the function Get_Cookie is working ok and that the javascript variable 'again' has the value 'Again' in it and has a length of 5. The alert function is not executed though. function check_invalid_user() { again = Get_Cookie('mylogon'); // document.write(again); // document.write(again.length); If (again == 'Again') { alert("User-id and/or password incorrect -- Please re-enter"); } } ============= Any help would be appreciated Many thanks in advance. (Yeah you guessed it I'm new and raw to this stuff. i have this line of code: Code: <a href="#" id="profilelink" name="link2" onClick="viewornot(<?php echo $freechat_id ?>)"><?php echo $freechat_list; ?></a> //call the JS onclick and if OK was click do the message box and send button here then i have my JS: Code: function viewornot(id) { var e = confirm('Do you want to view this profile?'); if (e == true) { window.location.href = "http://www-rainbowcode-net/apps_dev.php/profiles/showprofilepersonal?id="+id; window.location('http://www-rainbowcode-net/apps_dev.php/profiles/showprofilepersonal?id='+id); return true; } else { var e2 = confirm('Do you want to send a message?'); if (e2 == true) { //if ok was clicked send value back?? return e2; } } } on the e2 confirm: if i clicked OK how can i send a value back(so that i know OK was clicked) so that i can then produce the message box and send button and do the rest of the code to send a message??? thank you I am still learning javascript so forgive me if this question is a bad one, I am making scripts for Greasemonkey for a website I am a part of. One of the developers recently commented out (in the source code) a feature that was available before. It is a Football MMORPG game and it used to show college players 40 times but over the past month he commented out the tag that held the script function. I want to know if i can either A) write a js code that can remove the comment tag in the source code or B) write a code that will just add another tag under that and have that js function that was commented out valid. I tried something but ended up just having that function pasted onto the page instead of having it put into the source to have it read by the rest of the data.. here is what im talking about <TABLE width=800 cellspacing=0> <tr> <td colspan=3 style="FONT-SIZE: 11pt"> <b>Hometown:</b>Fort Hunt, VA<br> <b>Height:</b>6-0<br> <b>Weight:</b>206<br> <!--b>40 Time:</b><if rs("team_id")>0 or bRated then><=formatnumber(rs("forty"),2)><br><end if --> i just want to see if there was any way to just delete the comment out of it so i can get this feature again is all. Any help would be awesome... and sorry for the long post I will be completely up front about this, its school work. At the end of a basic html class I missed several classes for family reasons and missed just about everything on Javascript. The book we used basically didnt cover anything over it, was all in class learning I missed. Anyone who could help would be so helpful. One function is partial, one is blank, thats what is supposed to be added/corrected to the following code Code: <html> <head> <script language="javascript" type="text/javascript"> function processScore() { var score = 0; if ( ...checked) {score = score + 1;} if (...checked) {score = score + 1;} document.answerForm.score.value = score; // Display the correct answers document.answerForm.answer1.value = " "; // put the correct value here document.answerForm.answer2.value = " "; // put the correct value here } //End of function processScore function clearForm() { // using the a javascript method clear all forms } </script> </head> <body style="font-family:tahoma; font-size:15px; line-height:200%; width:80%; margin-left:auto; margin-right:auto;"> <hr color="red" width="60%" size="5"> <form name="question1" id="question1"> 1. Which of the following is the document considered to be?<br/> <input type = "radio" name="choiceRB"> a. object<br /> <input type = "radio" name="choiceRB"> b. property<br /> <input type = "radio" name="choiceRB"> c. method<br /> </form> <hr color="green" width="60%" size="5"> <form name="question2" id="question2"> 2. Which method of the window can be used to display a message to the user?<br/> <input type = "radio" name="choiceRB"> a. display()<br /> <input type = "radio" name="choiceRB"> b. message()<br /> <input type = "radio" name="choiceRB"> c. alert()<br /> </form> <hr color="red" width="60%" size="5"> <input type="button" value="Grade the Quiz" onclick=?> <input type="button" value="Start Over" onclick=?> <form name="answerForm" id="answerForm"> <p><strong>Correct Answers:</strong><br/></p> Question 1: <input type="text" name="answer1" size="1"><br /> Question 2: <input type="text" name="answer2" size="1"><br /> <p>You scored <input type="text" name="score" size = "1"> out of 2</p> </form> <br /> </body> </html> thnx in advance to anyone who can help I tried to write the variable my_var into a text file but it only shows null after executing the code. Can anybody help pls?? Below is my code <html> <head> <script language="javascript"> var my_var function WriteToFile() { my_var = 123; document.write(<?php $file="file.txt"; $fh = fopen($file, 'w') or die("can't open file"); ?>; document.write(<?php $stringData = my_var ?>; document.write(<?php fwrite($fh, $stringData); ?>; document.write(<?php fclose($fh); ?>; } </script> </head> <body onLoad="WriteToFile();"> <p>Hello World</p> </body> </html> Hi, I'm trying to get my head around JS, but not too successfully yet. My objective is probably simple (but not to me ): to have a form where visitors enter 12 separate digits (ideally in minutes & hours, but am happy to use decimals), and the average of these (to two decimal points) is returned as document.write is it? - along with other text, to make a complete & coherent sentence, including the average of the 12 numbers. Does anyone have any code convenient that could do this? Thanks, LJ I'm not a coder myself but I could use some help and am willing to pay if it's within reason. It's for a site I'm putting together for a hobby of mine. Here's a description of what I need done: http://masterengraver.com/ambigrams/test.html Please drop me an email with price for your time if you can do this. Thanks! / ~Sam Hello everyone, i desperatly need a script for my website but am totally stuck, I hope someone can help On my website i want a search box. I want it so that if a use types in one of my predetermined search terms then they would be sent to a predeterimed page in my own website. For example: I have a group of 5 keywords - nokia, mobile, vodafone, cellphone, iphone. If a user types any of those keywords into my search box then xxxxx.com/mobilephones.htm will be loaded up I have another set of 5 keywords - cat, dog, rabbit, mouse, snake. If a user types any of those into the search box then they are directed to xxxxx.com/animals.htm and so on ... So as you can see, its not a 'normal' search engine I will be creating new pages and will need to add the chosen keywords for it as time goes on etc Nearly everywhere i look for something to help me all I can find are standard search engine scripts which are no good as they display search results instead of directing to specific urls depending on the keywords entered I would also need to 'capture' what search terms are being entered so that I can build some user statistics I understand html and javacript to an intermediate level Can anyone help / provide a script that I could use? Although Im a student Im willing to pay some funds to anyone that can do this for me Many thanks Terry |