JavaScript - I'm A Newbie...please! Html Lists Making Javascript Array
I'm a newbie...please! html lists making javascript array
I need help with a HTML UL I have ul inside ul but all I want to get when I select a certain list is the children of that list but remove the ul inside that list so they dont show at all http://pastebin.com/m98deaff any help would be great , current selecting code is http://pastebin.com/m6f4b886f Code: <div class="demo" id="demo_1"> <ul> <li id="1" class="open"><a id="1" href="#"><ins> </ins>Root node 1</a> <ul> <li id="2"><a id="2" href="#"><ins> </ins>Child node 1</a></li> <li id="3"><a id="3" href="#"><ins> </ins>Child node 2</a></li> <li id="4"><a id="4" href="#"><ins> </ins>Some other child node with longer text</a></li> <li id="6"><a id="6" href="#"><ins> </ins>Root node 222</a> //SHOUL NOT BE IN MY ARRAY <ul> <li id="7"><a id="7" href="#"><ins> </ins>Child node 222a</a></li> <li id="8"><a id="8" href="#"><ins> </ins>Child node 222b</a></li> <li id="9"><a id="9" href="#"><ins> </ins>Some other child node with longer text 222</a></li> </ul> //END OF UL ELEMENT N OT NEEDED THERE COULD BE more than 1 </li> </ul> </li> <li id="5"><a id="5" href="#"><ins> </ins>Root node 2</a></li> </ul> Similar TutorialsHi I am trying to write a simple script for html form validation before going on to write a more complicated script for the full form which will eventually be on the web page. However, I cannot tell if the javascript is executing or not, as no alert messages come up. If I fill in the form with blanks (which is what the function checkform() checks for) then it should display an alert on submission and return false. Otherwise, returns true. I need to get this licked before going on to the more complex coding, but I really can't see why this doesn't appear to work. I'd be most grateful if some kind soul out there could have a look at it for me.... Links below. Thank you in anticipation! http://www.kellyresources.co.uk/onli...ment_test.html http://www.kellyresources.co.uk/checkform.js I have some code to pick a wire size and conduit size from 2 separate drop down list. Then inside the js it is evaluated to decide how many wires. My problem is I can't figure out how to make the drop down options go into the JS. I just put in an error alert to test if they were for now. Here is my code: Code: function fillcap(){ var wire = document.getElementById("wireSize"); var conduit = document.getElementById("conduitSize"); if (wire.option.length >= 10 && conduit.option.length == .5) { windows.alert("Wire Size exceeds conduit max fill!") } And the html Code: <h2>Fill Capacity</h2><br> <b>Wire Size</b><br> <select id ="wireSize"> <option value="1">#14</option> <option value="2">#12</option> <option value="3">#10</option> <option value="4">#8</option> <option value="5">#6</option> <option value="6">#4</option> <option value="7">#3</option> <option value="8">#2</option> <option value="9">#1</option> <option value="10">1/0</option> <option value="20">2/0</option> <option value="30">3/0</option> <option value="40">4/0</option> <option value="250">250</option> <option value="300">300</option> <option value="350">350</option> <option value="400">400</option> <option value="500">500</option> <option value="600">600</option> <option value="700">700</option> <option value="750">750</option> </select> <br> <b>Conduit Size</b><br> <select id="conduitSize"> <option value=".5">1/2</option> <option value=".75">3/4</option> <option value="1">1</option> <option value="1.25">1-1/4</option> <option value="1.5">1-1/2</option> <option value="2">2</option> <option value="2.5">2-1/2</option> <option value="3">3</option> <option value="3.5">3-1/2</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> </select><br> <input value="Wires allowed" onclick="fillcap()" type="button"> <input type="text" name="myresultbox" id="resultbox10"> Wires<br> Thank you for any advice. Hey, I've tried w3schools, tizag, and google, but haven't found exactly what I need. I need some way of easily figuring out which option in a drop down menu is checked, through the use of javascript, like how you can use document.formname.elementname[i].checked to find out which checkbox/radio button is checked. Anything that would return something that allows me to figure out which option has been chosen. I will need to have a function with 3 if statements, one for each option.
Hi On my web page I have 3 seperate catorgories with 2 drop down lists in each, the first dropdown list in each catergory is for "county" here is a snippet of the code Code: function fillCategory(){ addOption(document.drop_list.Category, "bedfordshire", "Bedfordshire", ""); addOption(document.drop_list.Category, "berkshire", "Berkshire", ""); addOption(document.drop_list.Category, "buckinghamshire", "Buckinghamshire", ""); addOption(document.drop_list.Category, "cambridgeshire", "Cambridgeshire", ""); I wanted to know if it is possible to use "list.js" to populate all 3 county dropdown lists or would I need "list.js" "list1.js" etc etc Hi Guys, I am after populating a HTML box (or another language if html wont do) with a number of different files pdfs, exe's etc for customer to download. The content of this box will depend on the choices from two drop down lists. I have got two drop down lists setup filtering off each other... I have thought about tagging each document and then pulling up a file off the choices selected? Not sure the best way to go about this. Regards Heres the code so far.... Code: <HTML> <HEAD><TITLE>prototype CP</Title> <style type="text/css"> .style1 { text-align: center; } .style2 { font-size: small; color: #FFFFFF; } .style3 { font-size: small; } </style> </Head> <BODY OnLoad="BuildContacts(0);" style="background-color: #336699; background-image: url('back.jpeg')"> <FORM Name="myForm"> <div class="style1"> <span class="style2">I have a </span> <font color="#000000"> <SELECT Name="SalesNames" OnChange="BuildContacts(this.selectedIndex);" class="style3"> <OPTION Value=""> <OPTION Value="nexgen">nexgen <OPTION Value="zimbra">zimbraCS <OPTION Value="exchange">exchange </Select></font><span class="style2"> mailbox and I want to set it up on: </span> <font color="#000000"> <SELECT Name="SalesContacts" class="style3"> <OPTION Value="">-------- </Select> </font> </div> </Form> </Body> </Html> <SCRIPT Language="JavaScript"><!-- //Build arrays for each mailbox type Contacts=new Array(4); Contacts[0]=new Array(3); Contacts[1]=new Array(2); Contacts[2]=new Array(5); Contacts[3]=new Array(4); //Nexgen Contacts[0][0]=""; Contacts[0][1]="Outlook"; Contacts[0][2]="mac mail"; Contacts[0][3]="entourage"; Contacts[0][4]="iPhone"; Contacts[0][5]="Blackberry"; Contacts[0][6]="other mobile phone"; //Zimbra Contacts[1][0]="Outlook"; Contacts[1][1]="mac mail"; Contacts[1][2]="entourage"; Contacts[1][3]="iPhone"; Contacts[1][4]="Blackberry"; Contacts[1][5]="other mobile phone"; //Exchange Contacts[2][0]="Outlook"; Contacts[2][1]="mac mail"; Contacts[2][2]="entourage"; Contacts[2][3]="iPhone"; Contacts[2][4]="Blackberry"; Contacts[2][5]="other mobile phone"; //Call this to build the Contact list for the specified Salesperson function BuildContacts(num) { //Select the first Contact document.myForm.SalesContacts.selectedIndex=0; //For every contact in the array for this person, add a new option for(ctr=0;ctr<Contacts[num].length;ctr++) { document.myForm.SalesContacts.options[ctr]=new Option(Contacts[num][ctr],Contacts[num][ctr]); } //Set the length of the select list document.myForm.SalesContacts.length=Contacts[num].length; } //--></Script> Hello everyone, I am trying to figure a solution to this CSS/JavaScript navigation menu. I have a couple of different classes set out for each level of the menu, which there are 4 levels max. The first level has a class for it called 'pMenuMain'. The second and third have names 'pMenu2' and 'pMenu3'. The 4th level is found by its <a> tags, because all of those are links. This is the JavaScript I need to change somehow: Code: <script src="http://code.jquery.com/jquery-1.6.1.min.js" type="text/javascript"></script> <script type="text/javascript"> var timeout = 1000; var closetimer = 0; var ddmenuitem = 0; function jsddm_open() { jsddm_canceltimer(); jsddm_close(); ddmenuitem = $(this).find('ul').css('visibility', 'visible');} function jsddm_close() { if(ddmenuitem) ddmenuitem.css('visibility', 'hidden');} function jsddm_timer() { closetimer = window.setTimeout(jsddm_close, timeout);} function jsddm_canceltimer() { if(closetimer) { window.clearTimeout(closetimer); closetimer = null;}} $(document).ready(function() { $('.pMenu2').hover(jsddm_open, jsddm_timer) $('.pMenu > li > ul').hover(jsddm_open, jsddm_timer)}); document.onclick = jsddm_close; </script> Now this is the CSS style sheet: Code: /********************/ /*PERSONAL NAV MENU**/ /********************/ .pWrapper { padding-bottom:53%; padding-left:21%; } .pMenu { margin:0; padding:0; list-style:none; } /*IE 6 & 7 need inline block feature*/ ul.pMenu ul li{ width:100%; display:inline-block; } ul.pMenu ul ul li{ width:100%; display:inline-block; } ul.pMenu ul ul ul li{ width:100%; display:inline-block; } /*begin main list attributes*/ ul.pMenu > li:hover{ background:#F00; border:.33em ridge #C90; color:#FF0; } ul.pMenu > li{ float:left; list-style:none; margin-right:1%; display:block; color:#FFF; background:#900; border:.33em ridge #C30; text-decoration:none; } .pMenuMain{ text-shadow:1px 1px 1px #000; white-space:nowrap; padding-top:.7em; padding-bottom:.7em; text-align:center; } /*first sub-list*/ ul.pMenu li li{ margin-right:0; } ul.pMenu ul { margin:0; padding:0; position:absolute; visibility:hidden; } .pMenu2{ background:#CCC; border:.25em outset #999; width:10em; font-size:12px; padding-top:.5em; padding-bottom:.5em; padding-right:2em; padding-left:.5em; text-decoration:none; text-shadow:1px 1px 1px #000; color:#000; position:relative; text-align:left; top:.33em; visibility:hidden; } .pMenu2:hover{ background:#999; border:.25em inset #666; text-decoration:blink; } /*second sub-list*/ ul.pMenu ul ul{ margin:0; padding:0; position:absolute; visibility:hidden; display:none; } .pMenu3{ background:#999; border:.25em outset #666; width:13em; font-size:11px; padding-top:.35em; padding-bottom:.35em; padding-right:2em; padding-left:.5em; text-decoration:none; text-shadow:1px 1px 1px #000; color:#000; position:relative; text-align:left; top:.33em; visibility:hidden; } ul.pMenu ul ul li { float:none; display:inline; } ul.pMenu ul ul li a { width:auto; background:#999; border:.15em outset #666; text-shadow:1px 1px 1px #000; color:#FFF; } ul.pMenu ul ul a:hover { background:#999; border:.15em inset #666; text-decoration:blink; } /*third sub-list*/ ul.pMenu ul ul ul { margin:0; padding:0; position:absolute; visibility:hidden; } ul.pMenu ul ul ul li { float:none; display:inline; } ul.pMenu ul ul li a { width:auto; background:#999; border:1% outset #666; text-shadow:1px 1px 1px #000; color:#FFF; } ul.pMenu ul ul li a:hover { background:#999; border:1% inset #666; text-decoration:blink; } /******************/ /*End Personal Nav*/ /*****************/ This is how it's set up in HTML: Code: <!-- begin Personal navigation menu --> <div class="pWrapper"> <ul class="pMenu"> <li style="width:10%;"><div class="pMenuMain">health</div> <ul style="left:18em;"> <li><div class="pMenu2">weight loss</div> <ul> <li><div class="pMenu3">fitness</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu3">dieting</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> <li><div class="pMenu2">skin care</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:14%;"><div class="pMenuMain">insurance</div> <ul> <li><div class="pMenu2">property insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">auto insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">health insurance</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">annuities</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:11.3%;"><div class="pMenuMain">general</div> <ul> <li><div class="pMenu2">electronics</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">style & fashion</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">food/dining</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> <li><div class="pMenu2">cars/auto</div> <ul> <li><a href="#">under construction</a></li> </ul> </li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:10%;"><div class="pMenuMain">dating</div> <ul> <li><a href="#">RealMatureSingles</a></li> <li><a href="#">SeniorPeopleMeet</a></li> </ul> </li> </ul> <ul class="pMenu"> <li style="width:13.8%;"><div class="pMenuMain">education</div> <ul> <li><div class="pMenu2"><a href="#">under construction</a></div></li> </ul> </li> </ul> </div> <!-- end Personal navigation menu--> I know that I will receive critique for the HTML I created for this. The reason I am going this route is that a drop down menu with a list full of <a href="#"> can be clicked, resetting the menu. This is a flaw in functionality. Hi, just a quick question. Is it possible to make an array lowercase at all? or can you only do this with a string? Thanks. Hi guys, i am trying to work with google maps api my issue is with creating an array of markers count the number of marker, and then if it equal two, issue an error msg. i wrote some code, but that doesn't work obviously. and my question is how do i write that code in javascript ? GEvent.addListener(map, 'click', function (overlay, latlng) { if (placeMarker.length < 2) { pendingLatLng = latlng; setTimeout("settleClick()", 225) } else { message("You can only select 2 points."); } }); a sample click event which looks like the line below does work. what am i doing wrong ?: google.maps.event.addListener(map, 'click', function (event) {placeMarker(event.latLng); }) Hello, Im hoping someone can help me, Im trying to pass fields to a javascript function that will check the value of each field and it its empty then it will turn the field color red which is what its doing at the moment, but i want to be able to use this function globaly through out my project, so is there a way of not saying how many fields go in to that array, it will just deal with the amount of fields it gets passed? Thanks Hi there, this is my first post so forgive me if it is frustrating to those who try to help. I am trying to create a side navigation menu that I want to just be a heading then once clicked it toggles on a list. Each item must be a link to a different webpage. so far i have only managed to create a toggle list but cannot control each item to make it a unique link. I'll post the script I have so far; -------------------------------------------------------------------------- <script language="javascript" type="text/javascript"> function list_colours() { var i=0; var colours = new Array(); colours[0]=<a href="../Yellow Inventory.html"> Yellow </a>; colours[1]=<a href="../Orange Inventory.html">"Orange"</a>; colours[2]=<a href="../Pink Inventory.html">"Pink"</a>; colours[3]=<a href="../Green Inventory.html">"Green"</a>; colours[4]=<a href="../Blue Inventory.html">"Blue"</a>; colours[5]=<a href="../Red Inventory.html">"Red"</a>; var text=""; for(var i=0; i < colours.length; i++) { text = text + colours[i] + "</a><br/>"; } return text; } //creating a toggle menu var onOff = "off" function insertText() { if(onOff == "off") { var paragraph = document.getElementById("colour-items"); var colours_list = list_colours(); paragraph.innerHTML=colours_list; onOff="on" } else { var paragraph = document.getElementById("colour-items"); var colours_list=""; paragraph.innerHTML=colours_list; onOff="off" } } </script> <div id="left-container"> <div id="Nav-title"><h3 onmouseover="insertText();">Colours</h3></div> <p id="colour-items"></p> </div> ------------------------------------------------------------------------- It is my guess that you make the array lists a list of a links, though I can't seem to find the correct way how. The second problem I have is that I have a large number of images of products on my page. I would like 4 headings that contain all my images, like the toggle menu above. so I click the heading and only those images come up. I will be happy to answer any questions that may help. Thanks all. Hi There - I am a bit new to javascript and I am having a tough time coming to a solution to this problem I am having! I will try to explain.. first I have a call to a javascript button in a form of a form button: Code: <input type="submit" value=" Click This Button" onClick="fireMyPopup()"> Now the code for firemypopup() Code: function fireMyPopup() { myPopupRelocate(); document.getElementById("mypopup").style.display = "block"; document.body.onscroll = myPopupRelocate; window.onscroll = myPopupRelocate; } Now for the other function referenced there Code: Code: function myPopupRelocate() { var scrolledX, scrolledY; if( self.pageYOffset ) { scrolledX = self.pageXOffset; scrolledY = self.pageYOffset; } else if( document.documentElement && document.documentElement.scrollTop ) { scrolledX = document.documentElement.scrollLeft; scrolledY = document.documentElement.scrollTop; } else if( document.body ) { scrolledX = document.body.scrollLeft; scrolledY = document.body.scrollTop; } var centerX, centerY; if( self.innerHeight ) { centerX = self.innerWidth; centerY = self.innerHeight; } else if( document.documentElement && document.documentElement.clientHeight ) { centerX = document.documentElement.clientWidth; centerY = document.documentElement.clientHeight; } else if( document.body ) { centerX = document.body.clientWidth; centerY = document.body.clientHeight; } var leftOffset = scrolledX + (centerX - 850) / 2; var topOffset = scrolledY + (centerY - 200) / 2; document.getElementById("mypopup").style.top = topOffset + "px"; document.getElementById("mypopup").style.left = leftOffset + "px"; } As you might have guessed I am using this javascript to show a hidden div and keep it centered and following the screen scroll. This is working fine! It's the next part I am lost on! Here is the code for the div... Code: <div id="mypopup" name="mypopup" style="position: absolute; width: 800px; height: 400px; display: none; background: #ddd; border: 10px solid #000;"> <form action=(this will call a PL SQL package eventually)> <input type="hidden" name="CRN" value="'11111'"> <input type="hidden" name="TERM" value="1111"> <input type="hidden" name="CONF" value="y"> <input type="hidden" name="email1" value="1@aol.com"> <input type="hidden" name="email2" value="2@aol.com"> <input type="hidden" name="email3" value="3@aol.com"> <input type="hidden" name="activeemail" value="3"> <input type=''submit'' value='' Yes I Am 100% Sure'' onClick=''document.getElementById("mypopup").style.display="none"''>'); </form> </div> Ok now I will get to the nitty gritty here - the first issue is I would like to call the popup function and pass it a variable to signify which email is "active" amongst the hidden email fields. So when I call the popup function I want to say something like: Code: <input type="submit" value=" Click This Button" onClick="fireMyPopup(3)"> In a perfect world this 3 is passed along to fireMypopup and then somehow I would like to somehow change the active email hidden field to 3 as well. So my question is how would I change the code I provided to help me to figure out which email is active in the div. I am open to page refreshes etc, just has to be seemless i suppose. What am I trying to do? To sum it up I am printing an html form with lets say 15 rows. Each row has a column with an "email" button - which is this submit button. This submit button opens the "popup" or shows the div. Depending on which button is clicked I need to determine which email to send the email to. The popup window will be a simple form with 2 text fields and a submit button (which will call a PLSQL script to send the email) - but I need to know which hidden field email is the one that represents the click made. So the email gets sent to the proper email address :-) I am not opposed to new ways to do this - but the one constant is that these hidden fields containing all emails will be there. So if theres 15 emails, there will be 15 hidden fields + 1 for the active indicator (unless theres a better way) Thanks in advance - I am super confused! :-) - Jeff i am trying to create a simple counter that will start with a fixed number, say 5,000,000 and count up in increments of 1 every ten seconds with no end value set (infinitely).. This is for the non-profit I work for, and it is to show the number of bars of soap we have recycled to distribute to third world countries. Any help is greatly appreciated.
Hello I am totally new to javascript and am overwhelmed with this problem. I have tried a few different things but can't figure it out. I am trying to create a calculation of a total amount based on some fields. Here is what i am trying to do: I have five materials: Flex Vinyl, PSV, Rigid PSV, Vinyl Mesh, and Vinyl Banners Each material has a cost based on a total sq foot. Then two dropdown fields that add a certain amount. Here is what I have so far: Material [DROPDOWN MENU] Width [TEXT FIELD] Height [TEXT FIELD] Grommets [DROPDOWN] UV Coating [DROPDOWN] Total $ [TEXT FIELD AUTO-FILL AMOUNT] Is there a place that I can read about how to figure this out? I believe it would be something like: Width x Height = Total If Material One is selected then below numbers: If Total is greater than 1200 then Cost = .85 If Total is between 200 and 1200 then Cost = .50 If Total is between 20 and 49 then Cost = 1.00 If Less than 20 then Cost = 2.50 If PSV is selected then below numbers: If Total is greater than 1200 then Cost = .90 if Total is between 50 and 1200 then Cost = .75 ....and so on Amount = Cost x Width x Height + Grommets Selected Value + UV Coating Selected Value Any suggested reading/help that I can do to create this form? Hi guys, Started studying HTML , but having a bit of a problem creating <table>s. My instruction is to :"format the row in the table so that they alternate from white to grey. Within the grey rows format the text to white, Withing the white rows, format the text to black. I created a table for this in a previous exercise which I'll paste in the bottom. If I understand correctly, I need to use the table's <tr> element, but I don't know how it should be formatted. Any suggestions would be greatly appreciated. Here is what I got so far; <form action="" name="newsHeadlines"> <table border="0" width="100%"> <tr valign="top"> <td> <select name="headline" multiple="multiple" style="height: 93px"> <option onclick="document.newsHeadlines.news.value=newsItem1"> Investigation of building standards in quake zone </option> <option onclick="document.newsHeadlines.news.value=newsItem2"> Obama sees signs of economic progress </option> <option onclick="document.newsHeadlines.news.value=newsItem3"> Apple aplication downloads approach 1 Billion </option> <option onclick="document.newsHeadlines.news.value=newsItem4"> Jones, Braves beat winless Nationals 8-5 </option> <option onclick="document.newsHeadlines.news.value=newsItem5"> America's uninsured haven't shown collective power </option> </select> </td> <td> <textarea name="news" cols="50" rows="10" style="background-color : Transparent"></textarea> </td> </tr> </table> <script type="text/javascript"> /* <![CDATA[ */ /8 ]]> */ var newsItem1 = "Example1"; var newsItem2 = "Example2"; var newsItem3 = "Example3"; var newsItem4 = "Example4"; var newsItem5 = "Example5"; </script> </form> I am very new to JavaScript and am trying to create a page that calculate net annual pay and pops up an alert box that states what they will take home as well as pay in taxes. I have figured my way out of created the boxes to enter fields and even got a calculate button. I cannot figure out the code the actually calculate the taxes! Field one is for first name and referenced by id: num1 Field two is for last name and referenced by id: num2 Field three is enter gross salary with id: num3 I am using 20% for federal taxes and 10% for state taxes and need it to show up in an alert box... Any ideas? Thanks! I have been told that what I want to accomplish can be done with javascript. I have never used it, so I am at this forums mercy. I basically have to HTML inputs, the first are simple radio buttons, Yes and No. If no is checked (which is selected by default), then I want the 2nd input to be invisible to the user. Unfortunately I am not the original developer of the code. I have been asked to complete this in a very short amount of time. From the looks of the code, it looks like the condition will have to hide the entire table row with the id of 'voiceintrorow' if radio button 'playintro' with the value of 0 is checked. Here is my code. <tr id="playIntroRow"> <td class="editLabel"><span>*</span>Play Intro:</td> <td>Yes<input type="radio" name="playintro" value="1" /> No<input type="radio" name="playintro" value="0" checked /></td> </tr> //Hide this table row if the above radio button is checked NO <tr id="voiceIntroRow"> <td class="editLabel"><span>*</span>Intro Message:</td> <td><cfscript>voiceIntroRenderer.Render();</cfscript></td> </tr> Iguess javascript can accomplish this, but I don't know. I hope I posted this question correctly. Hi everyone, I'm currently stuck with a transition problem in my javascript (actually it's not mine) but since it's a little tricky to explain I've uploaded the page to a friend website so you can take a look at it. http://www.tanzstelle.net/simon/coel...red/index.html So when you hover between the link "car1" and "car2" the fading animation is absolutely correct but as soon as you hover lets say between "car2" and "car3" you'll see how during the transition "car1" shows up for a second - which is imho very annoying. Does anyone know how to tell js not to use "car1" between other transitions? I'm absolutely open to any new ideas but please remember I'm really a javascript/css newbie. Thank you. simon |