JavaScript - Looking For A Menu And Sortable List That Looks Like This:
Similar TutorialsI want a JS code for drag and drop sortable and editable tree list, similar below image. tnx a lot Hi guys, I am using jquery ui to have two connected sortable lists. The first list is available numbers, and the second is selected numbers. Everything with the jquery is working fine. The problem i am having is when i try to get the contents of the selected numbers box, it is empty, even though the sortables are or were dragged to that list. I tried using this... Code: var response = $("#selected_numbers_box").val(); alert( response ); and I also tried this.. Code: var response = $("#selected_numbers_box").html(); alert( response ); both are empty. What i am trying to do is retrieve the values of the new list "Selected numbers Box". Any suggestions? My code was taken directly from the jquery ui tutorial. Thanks in advance. Hi All, Here is my page in question: http://functionfirstfurniture.com/gallery/ If you click on a thumbnail BEFORE sorting any of the images, it appears in a pop-up lightbox. However, if you click AFTER sorting, the lightbox doesn't work and it just loads the image file in the browser window. What needs to happen so that the image will work as a lightbox all the time? I'm not very good at javascript and just used two script demos I found online, so I'm not even sure how to start looking at what is going wrong. Any help would be greatly appreciated. Thanks! http://74.220.207.105/~torasmos/shiurim/testsort.html this works in firefox but in ie I get an error Webpage error details Message: 'this.className' is null or not an object Line: 94 Char: 11 Code: 0 URI: http://74.220.207.105/~torasmos/shiurim/sorttable.js I am using the script from http://www.kryogenix.org/code/browser/sorttable/ does anyone have any idea what the issue is? Hello! Im very limited in my skills with html/JS/CSS and can only understand the concept of the varius coding but ot much more than that. Now i really need a sortable table like the one you can find on this site: Jämför & Hitta Billiga Små Lån Has anyone come across a tutorial or similar on how to build stuff like this? Or have any other hints for me to get started with? Any help is much appriciated Reply With Quote 12-25-2014, 06:27 PM #2 Wieli View Profile View Forum Posts New to the CF scene Join Date Dec 2014 Posts 5 Thanks 5 Thanked 0 Times in 0 Posts Hmm, cant find the option to clean the link, wasnt supposed to have a title like that. Reply With Quote 12-26-2014, 06:08 AM #3 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts No problem, the post worked. I don't have time tonight, but will try to show you this tomorrow. Question: How do you *create* the <table>?? From PHP? From AJAX? I wanted a custom look for my list menu. Here is what I came up with... http://schrene.web44.net/List-Menu.html I created it using divs with text overflow to get the scroll bar. Here is my code Code: <div id="colorList"> <center> <div class="mySelect" onClick="myFunction()">Abalone</div> <div class="mySelect" onClick="myFunction()">Acorn</div> <div class="mySelect" onClick="myFunction()">Adobe</div> <div class="mySelect" onClick="myFunction()">Allspice</div> <div class="mySelect" onClick="myFunction()">Antarctica</div> <div class="mySelect" onClick="myFunction()">Anthracite</div> <div class="mySelect" onClick="myFunction()">Aqualite</div> <div class="mySelect" onClick="myFunction()">Arctic Blueberry</div> <div class="mySelect" onClick="myFunction()">Arctic Ice</div> <div class="mySelect" onClick="myFunction()">Arctic Lime</div> <div class="mySelect" onClick="myFunction()">Cilantro</div> <div class="mySelect" onClick="myFunction()">Cinnabar</div> <div class="mySelect" onClick="myFunction()">Clam Shell</div> <div class="mySelect" onClick="myFunction()">Clove</div> <div class="mySelect" onClick="myFunction()">Cobalt</div> <div class="mySelect" onClick="myFunction()">Cocoa Brown</div> <div class="mySelect" onClick="myFunction()">Concrete</div> <div class="mySelect" onClick="myFunction()">Copperite</div> <div class="mySelect" onClick="myFunction()">Cottage Lane</div> <div class="mySelect" onClick="myFunction()">Designer White</div> <div class="mySelect" onClick="myFunction()">Doeskin</div> <div class="mySelect" onClick="myFunction()">Dove</div> <div class="mySelect" onClick="myFunction()">Earth</div> </center> </div> It worked great but it loses the scroll bar on iPhone. I want something that works for mobile web as well as traditional.. Does anybody have any ideas how to create a list menu like this??? Any help would greatly be appreciated i need help on designing a drop down list menu. this rolls down and shows other list of options to click on. i work in dreamweaver so javascripts and others can be incorporated. thanks all I am looking for something that works like this list/menu. Code: <html> <head> <title> trial </title> <script type="text/javascript"> function go(a) { c=document.getElementById("hidden").value; if(c!="") { document.getElementById(c).className="black"; } b=document.getElementById(a).value; document.getElementById(b).className="red"; document.getElementById("hidden").value=b; } </script> <style type="text/css"> .black {color: #000000;} .red {color: #c00;} </style> </head> <body> <select id="blue" onchange="go(this.id)"> <option value="1" id="1">1</option> <option value="2" id="2">2</option> <option value="3" id="3">3</option> <option value="4" id="4">4</option> <option value="5" id="5">5</option> <option value="6" id="6">6</option> </select> <input type="hidden" id="hidden" value=""> </body> </html> This code does not work "correctly" in IE It does work "correctly" in Firefox I need something that will work "correctly" in IE and Firefox I have looked high and low but have come up with nothing.... Also I don't know if it is possible but I would like to find something that changes the font color of every previous selection that has been made not just the last one. Has any one seen anything like that???? Hi all, I am having problems with a script 'Cut & Paste CSS Horizontal List Menu' from http://www.javascriptkit.com/script/...stopmenu.shtml It works on my site with Firefox but not IE 8. My site url is http://www.bridgepoint-llp.co.uk/ I would be grateful for any help anyone could supply I've ran the entire code through a javascript debugger a few times and I believe I weeded out the obvious errors. Also I believe I fixed some of the more hidden errors that one can't find with even the best debuggers.. Still it doesn't perform like it should? I found other scripts that do the same thing, but it defeats the purpose of me fixing it if I just write up a new code, even if it's easier. What make it hard for me to digest is it is somewhat complex compared to other codes that do the exact same thing. Any help? Also attached a zip file for those who want to see it externally.. Code section Code: <script type="text/javascript"> /* <![CDATA[ */ var sortItems = 1; function move(sourceList,targetList) { for(var i=0; i<sourceList.options.length; i++) { if(sourceList.options[i].selected && sourceList.options[i].value != "") { var no = new Option(); no.value = sourceList.options[i].value; no.text = sourceList.options[i].text; targetList.options[targetList.options.length] = yes; sourceList.options[i].value = ""; sourceList.options[i].text = ""; } } moveUp(sourceList); if (sortItems) doSort(targetList); } function moveUp(curOptionList) { for(var i=0; i<curOptionList.options.length; i++) { if(curOptionList.options[i].value == "") { for(var j=i; j<curOptionList.options.length-1; j++) { curOptionList.options[j].value = curOptionList.options[j+1].value; curOptionList.options[j].text = curOptionList.options[j+1].text; } var curLine = 0; break; } } if(curLine < curOptionList.options.length) { curOptionList.options.length -= 1; moveUp(curOptionList); } } function doSort(curOptionList) { var newOptions = new Array(); var tempOptions = new Object(); for(var i=0; i<curOptionList.options.length; i++) { newoptions[0] = curOptionList.options[0]; } for(var x=0; x<newOptions.length-1; x++) { for(var y=(x+1); y<newOptions.length; y++) { if(newOptions[x].text > newOptions[y].text) { tempOptions = newOptions[x].text; newOptions[x].text = newOptions[y].text; newOptions[y].text = tempOptions; tempOptions = newOptions[x].value; newOptions[x].value = newOptions[y].value; newOptions[y].value = tempOptions; } } } for(var i=0; i<curOptionList.options.length; i++) { curOptionList.options[i].value = newoptions[i].value; curOptionList.options[i].text = newoptions[i].text; } } /* ]]> */ </script> Form section Code: <body> <form action="" method="get" enctype="application/x-www-form-urlencoded"> <table border="0"> <tr> <td><select multiple="multiple" size="5" name="list1"> <option value="11">iPod Nano</option> <option value="12">iPod Shuffle</option> <option value="13">iPod Classic</option> </select></td> <td> <input type="button" value=" ›› " onclick="move(list1,list2)" name="B1" /> <br /> <input type="button" value=" ‹‹ " onclick="move(list2,list1)" name="B2" /> </td> <td><select multiple="multiple" size="5" name="list2"> <option value="21">MacBook</option> <option value="22">MacBook Pro</option> <option value="23">MacBook Air</option> </select></td> </tr> </table> </form> </body> </html> Hello Everyone, I am facing problem with divs indexes persistancy on sorting when browser refreshing. checkout this fiddle once and help me. Sortable-arindam - JSFiddle Here how can i maintain the divs persistancy on sorting when page refreshing. Thanks in Advance Satish Chandragiri Hi Everyone, I have a small doubt in jsp coding..I want to disable certain links on user login.These links come under a menu list. Clarifying more on this..I have created a web application which has got a login page..After login it redirects me to my home page..now when an administrator logs in he/she should be able to view all links on the menu list whereas when an user logs in he/she should only view a certain number of links based on his/her privileges..how can i write this code. Can anyone help me?? Its really really urgent!!!!!!!!!! please................ Hi... I did the Cut & Paste CSS Vertical List Menu, but I have an issue with submenus... Appear behind other divs. I attach a print screen. I include inside a div. Any idea? Code: <div id="sidebar1"> <ul id="verticalmenu" class="glossymenu"> <li><a href="http://www.javascriptkit.com/">JavaScript Kit</a></li> <li><a href="http://www.javascriptkit.com/cutpastejava.shtml" >Free JavaScripts</a></li> <li><a href="http://www.javascriptkit.com/">JavaScript Tutorials</a></li> <li><a href="#">References</a> <ul> <li><a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a></li> <li><a href="http://www.javascriptkit.com/domref/">DOM Reference</a></li> <li><a href="http://www.javascriptkit.com/dhtmltutors/cssreference.shtml">CSS Reference</a></li> </ul> </li> <li><a href="http://www.javascriptkit.com/cutpastejava.shtml" >DHTML/ CSS Tutorials</a></li> <li><a href="http://www.javascriptkit.com/howto/">web Design Tutorials</a></li> <li><a href="#" >Helpful Resources</a> <ul> <li><a href="http://www.dynamicdrive.com">Dynamic HTML</a></li> <li><a href="http://www.codingforums.com">Coding Forums</a></li> <li><a href="http://www.cssdrive.com">CSS Drive</a></li> <li><a href="http://www.dynamicdrive.com/style/">CSS Library</a></li> <li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Image Optimizer</a></li> <li><a href="http://tools.dynamicdrive.com/favicon/">Favicon Generator</a></li> </ul> </li> </ul> </div> Hi Chaps, I have a dynamic list menu: PHP Code: <?php $currentCat = ''; $first = true ;?> <ul> <?php do { if ($currentCat != $row_rsCategory['catname']) { if (!$first) { echo "\n</ul>\n</li>\n"; } $currentCat = $row_rsCategory['catname']; ?> <li><?php echo $row_rsCategory['catname']; ?> <ul> <?php }?> <li><?php echo $row_rsCategory['galleryname']; ?></li> <?php $first = false; } while ($row_rsCategory = mysql_fetch_assoc($rsCategory)); ?> </ul> </li> </ul> I've tried looking for a show/hide script, to toggle category names/gallery names, but could only find ones that have static menu options, and have failed to edit existing code to fit....any help or guidence would be appreciated! I am hoping you guys can help me with this issue. What I am trying to do is fairly simple, depending on what option you select in the menu I want the picture to change to different picture. The code that I posted below works perfectly except for one problem. I need the option value to display the color name, and not have the image code in it. I have researched ways to do this without having to use "value" but I just can't find one that works. Can someone please help me? Thanks in advance for any help given! Code: function changeimg(){ document.getElementById('colors').src=document.getElementById('color_dropdown_options').value } Code: <label> <select name="color" class="dropdown_options" id="color_dropdown_options" onchange="changeimg()"> <option value="/images/thumbnails/image1.jpg">White</option> <option value="/images/thumbnails/image2.jpg">Blue</option> <option value="/images/thumbnails/image3.jpg">Green</option> </select> </label> Code: <div id="display"><img src="/images/thumbnails/image1.jpg" width="270" height="382" alt="" id="colors" /> Hi all, I have been struggling on a bit of code for a while now. I need to populate a second drop down list (Region) based upon the selection of the first (County). I have found a piece of code that works on its own and have adapted to suit my needs - see below. However, when I drop it into my main page the javascript is not working. It's because of the formObject but I just don't know enough to resolve this! Furthermore, I need the textboxes the user has already completed in the form to retain their value once the javascript kicks in as the completed form will submit to a database. This piece of code is working well . . . . Code: <?php $link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error()); mysql_select_db('mydatabase') or die('Could not select database'); if(isset($_GET["County"]) && is_numeric($_GET["County"])) { $County = $_GET["County"]; } if(isset($_GET["Region"]) && is_numeric($_GET["Region"])) { $Region = $_GET["Region"]; } ?> <script language="JavaScript"> function autoSubmit() { var formObject = document.forms['theForm']; formObject.submit(); } </script> <form name="theForm" method="get"> <!-- County SELECTION BASED ON city VALUE --> <?php ?> <select name="County" onChange="autoSubmit();"> <option value=''</option> <?php //POPULATE DROP DOWN MENU WITH COUNTRIES FROM A GIVEN city $sql = "SELECT * FROM county_regions"; $counties = mysql_query($sql,$link); while($row = mysql_fetch_array($counties)) { echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>"); } ?> </select> <?php ?> <br><br> <?php if($County!= null && is_numeric($County)) { ?> <select name="Region" onChange="autoSubmit();"> <?php //POPULATE DROP DOWN MENU WITH RegionS FROM A GIVEN city, County $sql = "SELECT * FROM county_regions WHERE CountyID = $County "; $Regions = mysql_query($sql,$link); while($row = mysql_fetch_array($Regions)) { echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>"); } ?> </select> <?php } ?> What follows is my form where the javascript is not working - edited quite a bit to save on space! Code: <head> <script language="JavaScript"> function autoSubmit() { var formObject = document.forms['subform']; formObject.submit(); } </script> </head> <form enctype="multipart/form-data" method="post" action="add_attraction01.php" FORM NAME="FormName"> <input type="hidden" name="MAX_FILE_SIZE" value="32768" /> <label for="Business_name">Business Name</label> <input type="text" size="60" STYLE="color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12px; background-color: #72A4D2;" <id="Business_name" name="Business_name" maxlength=60/><font size="1" face="arial" color="red">Required field</font><br /> <label for="StreetAddress">Address</label> <input type="text" size="60" rows="2" id="StreetAddress" name="StreetAddress" maxlength=120/><font size="1" face="arial" color="red">Required field</font><br /> <label for="Town">Town</label> <input type="text" size="25" id="Town" name="Town" maxlength=25/><font size="1" face="arial" color="red">Required field</font><br /> <?php $link = mysql_connect('myhost', 'myusername', 'mypassword') or die('Could not connect: ' . mysql_error()); mysql_select_db('mydatabase') or die('Could not select database'); if(isset($_GET["County"]) && is_numeric($_GET["County"])) { $County = $_GET["County"]; } if(isset($_GET["Region"]) && is_numeric($_GET["Region"])) { $Region = $_GET["Region"]; } ?> <form name = "subform" method="get"> <select name="County" onChange="autoSubmit();"> <option value=''</option> <?php $sql = "SELECT * FROM county_regions"; $counties = mysql_query($sql,$link); while($row = mysql_fetch_array($counties)) { echo ("<option value=\"$row[CountyID]\" " . ($County == $row["CountyID"]? " selected" : "") . ">$row[County]</option>"); } ?> </select> <?php ?> <br><br> <?php if($County!= null && is_numeric($County)) { ?> <select name="Region" onChange="autoSubmit();"> <?php $sql = "SELECT * FROM county_regions WHERE CountyID = $County "; $Regions = mysql_query($sql,$link); while($row = mysql_fetch_array($Regions)) { echo ("<option value=\"$row[CountyID]\" " . ($Region == $row["CountyID"]? " selected" : "") . ">$row[Region]</option>"); } ?> </select> <?php } ?> <input type="text" size="20"id="Tel_No" name="Tel_No" maxlength=20 onkeypress="return isNumberKey(event)"/><font size="1" face="arial" color="red">Required field</font><br /> <br/> <input type="submit" value="Submit your attraction" name="submit" onclick="return BothFieldsIdenticalCaseSensitive();"/> </form> </body> </html> It's probably obvious to you guys!! Thanks in advance for your help. 09-01-10 Not sure exactly where to post this thread as it involves HTML, Javascript and embedded media players. It probably would be more appropriate here as there is much Javascript involved.... Hello, I am trying to construct a Jukebox for my website. I have spent considerable time all over the WEB and at this forum which addressed the issue in a 50 page thread. Please see: http://codingforums.com/showthread.php?t=50666 I got a lot of ideas from this thread but still cannot figure a way to do the following within the Jukebox. These are my main two questions for everything below: 1. How can I have the Jukebox cycle through all tunes and then start over from the beginning? 2. How can I allow the user to select a tune from a list but not a drop down list, have the Jukebox start from the user’s selection and then play all songs to the end. Then as in #1, start over from the beginning? Per this thread I came away with basically two ways to assemble the jukebox. One uses links in a drop down list which the user can choose from. The other is to use an .m3u playlist. The user can only select a “playlist” from the drop down. Below, I have included the code for each Jukebox. To see the Jukeboxes in action please go to my website where I have posted some test pages exhibiting the jukeboxes that I am referring to. The following is the Jukebox which utilizes an .m3u playlist. If I end up using this idea I would like the tunes in the .m3u playlist to be displayed and allow the user to be able to choose a tune in the list. Then have the list play to the end of all tunes in the list. Then start over from the beginning of the list. After this code is the .m3u playlist. Go to url removed and click on the link that says: “Media Player Using an .M3U Playlist” Jukebox utilizing an .m3u playlist: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <style type="text/css"> body { text-align:center; } </style> <script type="text/javascript"> function PlayIt(what){ player.document.getElementById('music').innerHTML='<object width="300" height="300" ' +'classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" ' +'codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" ' +'standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">' +'<param name="url" value="'+what+'">' +'<param name="uiMode" value="full">' +'<param name="autoStart" value="true">' +'<param name="loop" value="true">' +'<embed type="application/x-mplayer2" ' +'pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" ' +'showcontrols="true" uimode="full" width="300" height="45" ' +'src="'+what+'" autostart="true" loop="true">' +'</object>'; } </script> </head> <body> <div id="music"> <object width="300" height="300" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject"> <param name="url" value=""> <param name="uiMode" value="full"> <param name="autoStart" value="true"> <param name="loop" value="true"> <embed type="application/x-mplayer2" pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" showcontrols="true" uimode="full" width="300" height="45" src="" autostart="true" loop="true"> </object> </div> <br> <br> <select name="player" onchange="PlayIt(this.value)"> <option value="none">::Choose a Song::</option> <option value="JukeboxList.m3u">Jukebox List</option> </select><br> </html> Here is the .m3u playlist for the above code: Code: #EXTM3U #EXTINF:Bill Evans - G Waltz media/G Waltz.mp3 #EXTINF:Dan Pincus - In Your Time media/In Your Time.mp3 The following code is for the Jukebox that has a list of links in a dropdown list. If I go with this idea, I would like for the list not to be a dropdown list but just a list of tunes. The user should be able to click on any tune in the list and the player should start from that point, play all the remaining tunes in the list and then start from the beginning. Go to url removed and click on the link that says: “Media Player Using Links” Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Untitled Document</title> <style type="text/css"> body { text-align:center; } </style> <script type="text/javascript"> function PlayIt(what){ player.document.getElementById('music').innerHTML='<object width="300" height="300" ' +'classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" ' +'codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" ' +'standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">' +'<param name="url" value="'+what+'">' +'<param name="uiMode" value="full">' +'<param name="autoStart" value="true">' +'<param name="loop" value="true">' +'<embed type="application/x-mplayer2" ' +'pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" ' +'showcontrols="true" uimode="full" width="300" height="45" ' +'src="'+what+'" autostart="true" loop="true">' +'</object>'; } </script> </head> <body> <select name="player" onchange="PlayIt(this.value)"> <option value="none">::Choose a Song::</option> <option value="media/GWaltz.mp3">G Waltz</option> <option value="media/InYourTime.mp3">In Your Time</option> <option value="http://urltosong3.mp3">Song 3</option> <option value="http://urltosong4.mp3">Song 4</option> <option value="http://urltosong5.mp3">Song 5</option> </select><br> <div id="music"> <object width="300" height="300" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject"> <param name="url" value=""> <param name="uiMode" value="full"> <param name="autoStart" value="true"> <param name="loop" value="true"> <embed type="application/x-mplayer2" pluginspage="http://microsoft.com/windows/mediaplayer/en/download/" showcontrols="true" uimode="full" width="300" height="45" src="" autostart="true" loop="true"> </object> </div> </html> Another idea I found on the WEB also uses an .m3u playlist. The good thing about it is that it lists all the tunes in the playlist which the user can then select from. This jukebox calls up an entire Windows Media Player. If I was to use this idea I would like to be able to disable the left side of the player where the user has options such as burning to CD, Media Guide, Radio Tuner etc… Go to url removed and click on the link that says: “Media Player Within an IFrame Using .m3u Playlist”” Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JukeBox</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="Expires" content="-1"> </head> <body> <IFRAME name="frame" src="JukeboxList.m3u" width="100%" height="347" scrolling="no" frameborder="0"> [Your user agent does not support frames or is currently configured not to display frames.] </IFRAME> </body> </html> Thanks! Dan I would like to make an ordered list, for example: 1. Airplane 2. Boat 3. Car I'd like one of the words to be displayed on my webpage, for example: Boat Then I'd want an up button, and a down button. The up button would display Airplane instead of Boat, and the down button would display Car instead of Boat. Once it got to Car, the same up button would change it back to boat. How do I do this? Thanks. |