JavaScript - Expand And Hide
Hello forum,
I need some help please. I need a javascript which hides X and shows Y if a button (text) is pressed. Needs to work on a webpage. Can someone help? Similar TutorialsHello everyone, I am just learning the basics of javascript, and am finding myself stuck. Any help is greatly appreciated. So, I'm using the below javascript for expand / collapse text, it suffices well. However it will only collapse either table rows, or table data cells. Now, I know that these tags Code: {var trs = table.getElementsByTagName('tr'); {var a = trs[i].getElementsByTagName('td') Make the rows / data cells expand. However, I cannot seem to make it work on headers. To be lucid, I would like to know what I have to add, or edit to make the below code expand table headers (<th>), and perhaps div tags. The full javascript is thus : Code: window.onload = function() { var table = document.getElementById('stjorn'); if (table) { var trs = table.getElementsByTagName('tr'); for(var i = 0; i < trs.length; i++) { var a = trs[i].getElementsByTagName('td')[0].getElementsByTagName('a')[0]; a.onclick = function() { var span = this.parentNode.getElementsByTagName('span')[0]; span.style.display = span.style.display == 'none' ? 'block' : 'none'; this.firstChild.nodeValue = span.style.display == 'none' ? 'More' : 'Less';}; } } }; Thank you for your time. Hi, Please find the attached HTML Source Code. I was able to achieve Collapsing/Expand at Project Level but not at the vendor level. However, same HTML works fine with IE 8 and FF. The Expand/Collapse at the Vendor Level fails with XHMTL Strict 1.0 and IE 7. Can any one please help? Thanks Hi there guys, nive beiing a part of this forum, hope to have some help in a issue, many forums couldnt responde to me or guide me for a solution, i have a menu of a site, and i liked to when is clicked a submenu of a menu that gets expand the menu stays open. for examplo of you guys go to this site of mine http://bonuccidesigns.cer33.com And go to link "Services", and click in a submenu named Services1, the menu Services closes...i liked to do is when i click in submenu services1 the menu services stays open, could someone help me? the code that gerantes the animation is "utils.js Hope for some help guys Be well I am writing a Chrome extension script in Javascript that will expand all YUI containers on a specific website. I cannot seem to find how the onClick event is handled. Here is the webpage: https://www.lendingclub.com/browse/browse.action When you click on an item in the list, it expands to show the item details. I would like to automate this through a script but cannot figure out how to manipulate the DOM. Any help would be much appreciated. Thanks I have this Code: function showResults( results ) { if ( results.length == 0 ) { msg = "No matches found, try again"; } else if ( results.length > 1 ) { msg = "More than one match found, try again."; } else { msg = results[0]; } <div id="RESULTS" style="position: relative; width: 200px; border: solid brown 1px; background-color: wheat; height: 20px; ; overflow: visible;"> </div> when the text results are placed in the div results are cut off or overflow based on visible/hidden. can someone tell me how to make the div expand vertically with the results ? Hi there, I have this form whereby when there is a "File Upload Input" aka "<input id="File1" type="file" />" (I don't know the actual name, but that's not the point). The user will be able to click on "Add another attachment", which is situated below the File Upload Input. Right now, when the user clicks on it, another "File Upload Input" will appear, and will be placed below the newly-added "File Upload Input". Therefore, whenever the user clicks on the "Add another attachment", it will automatically move downwards to be situated below the newly-added "File Upload Input". How should I do it? Also, when I click on the "textbox" of the "File Upload Input", it will pop up the dialog box for me to upload my file. How can I disable it so that the user can only upload it via the "Browse" button? My code is shown as below: Code: <!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> <title>Untitled Page</title> <style type="text/css"> #Select1 { width: 209px; } #Text1 { height: 143px; width: 209px; } .style17 { height: 330px; width: 427px; margin-left: 50px; } #Submit1 { margin-left: 240px; } </style> <script type="text/javascript"> var COLLAPSABLE_HELPDESK_PARENT_NAME = "collapsable_helpdesk"; var COLLAPSABLE_HELPDESK_PARENT_TYPE = "div"; var COLLAPSABLE_HELPDESK_CHILD_TYPE = "p"; var COLLAPSABLE_HELPDESK_EXPAND = "Add another attachment"; var COLLAPSABLE_HELPDESK_SHRINK = "Add another attachment"; init = function() { if(document.getElementById && document.createTextNode) { var entries = document.getElementsByTagName(COLLAPSABLE_HELPDESK_PARENT_TYPE); for(i=0;i<entries.length;i++) if (entries[i].className==COLLAPSABLE_HELPDESK_PARENT_NAME) assignCollapse(entries[i]); } } assignCollapse = function (div) { var button = document.createElement('collapse_add_attachment'); button.style.cursor='pointer'; button.setAttribute('expand', COLLAPSABLE_HELPDESK_EXPAND); button.setAttribute('shrink', COLLAPSABLE_HELPDESK_SHRINK); button.setAttribute('state', -1); button.innerHTML='dsds'; div.insertBefore(button, div.getElementsByTagName(COLLAPSABLE_HELPDESK_CHILD_TYPE)[0]); button.onclick=function(){ var state = -(1*this.getAttribute('state')); this.setAttribute('state', state); this.parentNode.getElementsByTagName(COLLAPSABLE_HELPDESK_CHILD_TYPE)[0].style.display=state==1?'none':'block'; this.innerHTML = this.getAttribute(state==1?'expand':'shrink'); }; button.onclick(); } window.onload=init; </script> </head> <body> <div class="style17"> <table cellpadding="5"> <tr> <td> Category: </td> <td> <select id="Select1" name="D1"> <option></option> </select><br /> </td> </tr> <tr> <td> Description:<br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> </td> <td> <input id="Text1" type="text" /> </td> </tr> <tr> <td> Attachment: </td> <td> <input id="File1" type="file" /> </td> </tr> </table> <div class="collapsable_helpdesk"> <p> <input id="File2" type="file" /> </p> </div> <br /> <input id="Submit1" type="submit" value="Submit" /> </div> </body> </html> Is it possible to atchually make a javascript that onMouseOver an image expands a seperate image and also works multiple times? say from 1 px wide to 25px wide? It would be a great help if someone could help me with this one. Is it possible to have a thumbnail of a video, then when you click it it expands so you can watch it without having to link to a different page? I'm thinking kind of like how people link youtube videos on facebook
Hi everyone I wondered if someone may help me. I downloaded a free web template that I am converting into .tpl file for a php script I use everything is going fine apart from one thing the collapse and expand script for categories in the template, it works perfectly on the template as downloaded but when it is in my .tpl files that work with the php script the collapse expand script works but the images are not displayed when you collapse then when you expand againe the expanded icon is also not displayed, as I say this works perfectly as downloaded in a .html file but not in the .tpl when running the php. Could someone take a look at the coding and tell me what maybe wrong I know nothing about Java script, PHP only a bit about html and I am pulling my hair out. Here is the Java script Bit Code: $('#wrap-categories .expanded').click(function() { if($("ul#category-menu").css("display") == 'none'){ $('#wrap-categories .expanded').css("background", "url(images/cat-expanded-icon.png) no-repeat center center"); $("ul#category-menu").show(); } else{ $('#wrap-categories .expanded').css("background", "url(images/cat-collapsed-icon.png) no-repeat center center"); $("ul#category-menu").hide(); } }); My CSS for the colapsable stuff Code: #wrap-categories .wrap-title-black .expanded{ float: left; width: 40px; height: 40px; background: url(../images/cat-expanded-icon.png) no-repeat center center; } #wrap-categories .wrap-title-black .collapsed{ float: left; width: 40px; height: 40px; background: url(../images/cat-collapsed-icon.png) no-repeat center center; } #wrap-categories .wrap-title-black .expanded:hover, #wrap-categories .wrap-title-black .collapsed:hover{ cursor: pointer; } And finaly the actual .tpl code for the colapsable bit Code: <div id="wrap-categories"> <div class="wrap-title-black"> <h2 class="nice-title">{L_276}</h2> <div class="expanded"></div> </div> <ul id="category-menu"> <!-- BEGIN cat_list --> <li><a href="browse.php?id={cat_list.ID}">{cat_list.NAME} {cat_list.CATAUCNUM}</a></li> <!-- END cat_list --> <li><a href="{SITEURL}browse.php?id=0">{L_277}</a></li> </ul> </div> I would apreciate some help and thank you in advance I have the following functions: Code: <script> var timerlen = 5; var slideAniLen = 500; var timerID = new Array(); var startTime = new Array(); var obj = new Array(); var endHeight = new Array(); var moving = new Array(); var dir = new Array(); function slidedown(objname){ if(moving[objname]) return; if(document.getElementById(objname).style.display != "none") return; // cannot slide down something that is already visible moving[objname] = true; dir[objname] = "down"; startslide(objname); } function slideup(objname){ if(moving[objname]) return; if(document.getElementById(objname).style.display == "none") return; // cannot slide up something that is already hidden moving[objname] = true; dir[objname] = "up"; startslide(objname); } function startslide(objname){ obj[objname] = document.getElementById(objname); endHeight[objname] = parseInt(obj[objname].style.height); startTime[objname] = (new Date()).getTime(); if(dir[objname] == "down"){ obj[objname].style.height = "1px"; } obj[objname].style.display = "block"; timerID[objname] = setInterval('slidetick(\'' + objname + '\');',timerlen); } function slidetick(objname){ var elapsed = (new Date()).getTime() - startTime[objname]; if (elapsed > slideAniLen) endSlide(objname) else { var d =Math.round(elapsed / slideAniLen * endHeight[objname]); if(dir[objname] == "up") d = endHeight[objname] - d; obj[objname].style.height = d + "px"; } return; } function endSlide(objname){ clearInterval(timerID[objname]); if(dir[objname] == "up") obj[objname].style.display = "none"; obj[objname].style.height = endHeight[objname] + "px"; delete(moving[objname]); delete(timerID[objname]); delete(startTime[objname]); delete(endHeight[objname]); delete(obj[objname]); delete(dir[objname]); return; } </script> I have the following div tag: Code: <div id='mydiv' style='display:none'>some content</div> ....and then I have an ahref tag like so: Code: <a href="javascript:;" onclick="slidedown('mydiv');">Slide Down</a> <a href="javascript:;" onclick="slideup('mydiv');">Slide Up</a> What happens is that it just unhides real quick, and then will not work after that...it does shoot an error, which is 'Invalid argument'...and nothing else. It is craping out on the following line: obj[objname].style.height = d + "px"; not sure why...so if anyone has any insight on what I am doing wrong...please let me know. Hey guys. I've done a script where a paragraph expands when the expand button is clicked (plus.gif) and contracts when the same button is clicked again. Only problem is I want the icon to change to a minus icon (minus.gif) once it the paragraph has expanded. I'll obviously need to include this in the script, however I'm not sure how to go about it. Collapsed: Expanded: Here is the HTML: Code: <script type="text/javascript" src="expandCollapse.js"></script> <a href="javascript:void(0" onclick="return toggleMe('para2')" style="color:#ec008c"><p><img src="images/plus.gif" border="0" hspace="6" vspace="0" /></a><strong><font size="3">Beginners 2</font></strong></p> <div id="para2" style="display:none"><p>*</p> <p>Students can progress to this level upon completion of the Beginners 1. You will be taught slightly more complex pole tricks and combinations that require all the strength and agility you have gained so far. This is when you will go upside down on the pole, and how to come down gracefully!</p> <p>*</p> <p><o:p></o:p></p> <p>Cost: $220.00</p> <p>*</p> <p><o:p></o:p></p> <p>Length: 1 Hour</p> <p>*</p> <p><o:p></o:p></p> <p>Duration: 8 Weeks<o:p></o:p></p> <p><o:p>*</o:p></p></div> And here is the current javascript in 'expandCollapse.js': Code: function toggleMe(a){ var e=document.getElementById(a); if(!e)return true; if(e.style.display=="none"){ e.style.display="block" } else { e.style.display="none" } return true; } Any help much appreciated, cheers! Hello, Can someone please assist me with making a script work with a 3-tier menu? http://howto.50webs.net/tutorial.php?id=165# Right now, it's only programmed for two. I need to be able to expand like this: + Item ... + Item ...... - Item ...... - Item Here it is in practice: http://golubcapital.com/relaunch/collapse-expand.php If you expand Direct Lending you'll see that Industry Verticals opens already expanded and can't be closed. Thanks in advance for any help. Christine Hi everybody, I have this expand/contract thing, whereby a button is situated below a label "Advanced Features". And so when the user clicks on "Advanced Features", the button will drop below the whole expansion. The button should be situated BEFORE the label before clicking onto "Advanced Features". Any ideas on how I can do this? Code: <!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> <title></title> <script language = "javascript" type = "text/javascript"> var collapsable_parent_name = "collapseExpand"; var collapsable_parent_type = "div"; var collapsable_child_type = "div"; var collapsable_expand = "Advanced Features"; var collapsable_shrink = "Simple Features"; init = function() { if(document.getElementById && document.createTextNode) { var entries = document.getElementsByTagName(collapsable_parent_type); for(i = 0; i < entries.length; i++) if (entries[i].className == collapsable_parent_name) assignCollapse(entries[i]); } } assignCollapse = function (div) { var button = document.createElement("collapse_add_adv_features"); button.style.cursor = "pointer"; button.setAttribute("expand", collapsable_expand); button.setAttribute("shrink", collapsable_shrink); button.setAttribute("state", -1); div.insertBefore(button, div.getElementsByTagName(collapsable_child_type)[0]); button.onclick=function() { var state = -(1*this.getAttribute("state")); this.setAttribute("state", state); this.parentNode.getElementsByTagName(collapsable_child_type)[0].style.display=state==1?'none':'block'; this.innerHTML = this.getAttribute(state==1?"expand":"shrink"); }; button.onclick(); } window.onload = init; </script> </head> <body> <table> <label> *First Name:</label> <input id="Text16" type="text" name="First Name" onkeydown="return noSpace(event)" /> <br /> <br /> <label> *Last Name:</label> <input id="Text17" type="text" name="Last Name" onkeydown="return noSpace(event)" /><br /> <br /> <div class="collapseExpand"> <div> <br /> <ul id="mailboxTabs" class="shadetabs"> <li><a class="selected" href="#" rel="mailbox1">1</a></li> <li><a class="" href="#" rel="mailbox2">2</a></li> <li><a class="" href="#" rel="mailbox3">3</a></li> </ul> <div class="contentBox"> <div style="display: block;" id="mailbox1" class="tabcontent"> </div> <div style="display: none;" id="mailbox2" class="tabcontent"> </div> <div style="display: none;" id="mailbox3" class="tabcontent"> </div> <div style="display: none;" id="mailbox4" class="tabcontent"> </form> </div> </div> </div> </div> </div> <script type="text/javascript"> var switchMBTabs=new ddtabcontent("mailboxTabs") switchMBTabs.setpersist(true) switchMBTabs.setselectedClassTarget("link") //"link" or "linkparent" switchMBTabs.init() </script> <input id="Submit17" type="submit" value="Submit" onclick="return check()"/> </td> </tr> </table> </body> </html> Hello, Can anyone tell me where I can find the code being used here to expand and collapse text(under the Bio section). It's exactly what I am looking for and would be much appreciated. Thanks. Hi, I want to make a list that expands and collapses like on the lynda.com site. See example http://www.lynda.com/Rhino-4-tutoria...g/59223-2.html I would also like to make it fade in and out when collapsing and expanding. I haven't been able to find a lot of information on how to do this. Would this be best using something like jQuery or just plain JavaScript? By the way I'm just starting to learn JavaScript, so any level of explanation is helpful. Hi, JS newbie here trying to cobble together enough to get this page done. Here's the snippet I'm having trouble with (sorry, I know it's sloppy, if you have a better way to do it by all means please post): Code: function showAdv() { if(claroxanadvanced.style.display == "none") { claroxanadvanced.style.display = "block"; claroxanoriginal.style.display = "none"; smokersformula.style.display = "none"; } else { } } function showOri() { if(claroxanoriginal.style.display == "none") { claroxanadvanced.style.display = "none"; claroxanoriginal.style.display = "block"; smokersformula.style.display = "none"; } else { } } function showSmo() { if(smokersformula.style.display == "none") { claroxanadvanced.style.display = "none"; claroxanoriginal.style.display = "none"; smokersformula.style.display = "block"; } else { } } And the page where it is implemented: http://www.claroxan.com/test/ Firefox's debug window says it might be an issue of undeclared variables - 'claroxanadvanced', 'claroxanoriginal' and 'smokersformula' are all div IDs in the html, what line should I put to declare them? Thanks i presently have a text area which is generated using two arrays.It is loaded at the screen load. It is as following. var channelsGroups = new Array(); var channelsChildren = new Array(); channelsGroups[0]= new Array('Mars Public', 'MARS-PUB'); channelsChildren[0]=new Array(); channelsGroups[1]= new Array('Mars Private', 'MARS-PRIVA'); channelsChildren[1]=new Array(); channelsGroups[2]= new Array('Internet Booking Engine', 'IBE'); channelsChildren[2]=new Array(); channelsGroups[3]= new Array('mars Private Agent Specific', 'M-P-AGENT'); channelsChildren[3]=new Array(); channelsChildren[3][0]=new Array('AGT_002',' AGT_002 '); channelsChildren[3][1]=new Array('CARLSON WAGONLIT AUSTRALIA PTY',' 235830 '); channelsChildren[3][2]=new Array('Travel Zone',' TRAVELZONE '); channelsChildren[3][3]=new Array('Worldlink Travels',' WORLDLINK '); channelsChildren[3][4]=new Array('AAAAAAARFDS',' ADM2 '); channelsChildren[3][5]=new Array('AAASSRet',' DMM3 '); channelsChildren[3][6]=new Array('Adrian Travels',' DMM1 '); channelsChildren[3][7]=new Array('Buraha Travels',' DMM2 '); and more Output in the textArea is as following i presently have a text area which is generated using two arrays.It is loaded at the screen load. It is as following. i presently have a text area which is generated using two arrays.It is loaded at the screen load. It is as following. Mars Public Mars Private Internet Booking Engine mars Private Agent Specific -AGT_002 -CARLS... I hope you inderstand the pattern. I want first to display only the groups(Mars Public, Mars Private) and when someone clicks on mars private Agent specific, the list of agents appear. There are other groups below agents and those groups also may have children.Those groups also should have the same on click functioanlity? Any Idea? Thank you in advance... Hey guys I am having little trouble with this jQuery. The code seems to be working in all browsers and suffers only minor issues in IE. For some reason, the last 4 items do not expand/contract on IE (ONLY). Any help will be gladly appreciated. Here's my code: Code: <head> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://www.modbargains.com/images/Javascript/Collapse/animatedcollapse.js"> </script> <script type="text/javascript"> animatedcollapse.addDiv('bodykits', 'fade=1,height=70px') animatedcollapse.addDiv('brakes', 'fade=1,height=40px') animatedcollapse.addDiv('chipsandtuners', 'fade=1,height=20px') animatedcollapse.addDiv('engineparts', 'fade=1,height=260px') animatedcollapse.addDiv('exhaust', 'fade=1,height=270x') animatedcollapse.addDiv('exterior', 'fade=1,height=160px') animatedcollapse.addDiv('interior', 'fade=1,height=105px') animatedcollapse.addDiv('suspension', 'fade=1,height=155px') animatedcollapse.addDiv('wheels', 'fade=1,height=280px') animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted //$: Access to jQuery //divobj: DOM reference to DIV being expanded/ collapsed. Use "divobj.id" to get its ID //state: "block" or "none", depending on state } animatedcollapse.init() </script> <style type="text/css"> .collapselist li { padding:2px 0px 2px 8px; background:url(http://www.modbargains.com/Theme/02/c_arrow.gif) no-repeat 0px 0px;} </style> </head> <body> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('bodykits')">Body Kits</a> <div class="collapselist" id="bodykits" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/iCarbon-Carbon-Fiber-Body-Parts.htm">iCarbon Products</a></li> <li><a href="http://www.modbargains.com/ARKYM-Carbon-Fiber-Areo-Kits.htm">ARKYM CF Aero Kits</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('brakes')">Brakes</a> <div class="collapselist" id="brakes" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/Brembo-brakes.htm">Brembo Brakes</a></li> <li><a href="http://www.modbargains.com/Stoptech.htm">StopTech Brakes</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('chipsandtuners')">Chips and Tuners</a> <div class="collapselist" id="chipsandtuners" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/Cobb-AccessPORT-ECU-Flash-BMW-N54-135i-335i-535i-AP-BMW-001.htm">Cobb AccessPORT</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('engineparts')">Engine Parts</a> <div class="collapselist" id="engineparts" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/afe-power-parts.htm">aFe Power Intakes</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Parts.htm">OEM BMW Parts</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Performance-Parts.htm">OEM BMW Performance Parts</a></li> <li><a href="http://www.modbargains.com/Rogue-Engineering.htm">Rogue Engineering Parts</a></li> <li><a href="http://www.modbargains.com/Rogue-Engineering.htm">Rogue Engineering Parts</a></li> <li><a href="http://www.modbargains.com/Evolution-Racewerks.htm">Evolution Racewerks</a></li> <li><a href="http://www.modbargains.com/Cusco-Suspensions-Strut-Bars-Braces.htm">Cusco Strut Bars/Braces</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> <li><a href="http://www.modbargains.com/Active-Autowerke.htm">Active Autowerke</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('exhaust')">Exhaust</a> <div class="collapselist" id="exhaust" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/Remus-Exhaust.htm">Remus SportExhaust</a></li> <li><a href="http://www.modbargains.com/Supersprint-Performance-Exhaust-Systems.htm">Supersprint</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Parts.htm">OEM BMW Parts</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Performance-Parts.htm">OEM BMW Performance Parts</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> <li><a href="http://www.modbargains.com/Eisenmann-Exhaust.htm">Eisenmann-Exhaust</a></li> <li><a href="http://www.modbargains.com/Borla-Exhausts.htm">Borla Exhaust</a></li> <li><a href="http://www.modbargains.com/Active-Autowerke.htm">Active Autowerke</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('exterior')">Exterior</a> <div class="collapselist" id="exterior" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/OEM-BMW-Parts.htm">OEM BMW Parts</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Performance-Parts.htm">OEM BMW Performance Parts</a></li> <li><a href="http://www.modbargains.com/iCarbon-Carbon-Fiber-Body-Parts.htm">iCarbon Products</a></li> <li><a href="http://www.modbargains.com/ARKYM-Carbon-Fiber-Areo-Kits.htm">ARKYM CF Aero Kits</a></li> <li><a href="http://www.modbargains.com/Evolution-Racewerks.htm">Evolution Racewerks</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('interior')">Interior</a> <div class="collapselist" id="interior" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/OEM-BMW-Parts.htm">OEM BMW Parts</a></li> <li><a href="http://www.modbargains.com/OEM-BMW-Performance-Parts.htm">OEM BMW Performance Parts</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> <li><a href="http://www.modbargains.com/Active-Autowerke.htm">Active Autowerke</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('suspension')">Suspension</a> <div class="collapselist" id="suspension" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/KW-Suspension.htm">KW Suspension</a></li> <li><a href="http://www.modbargains.com/PowerFlex-Urethane-Suspension-Bushings.htm">PowerFlex Suspension Bushings</a></li> <li><a href="http://www.modbargains.com/HR-Suspensions.htm">H&R Suspensions</a></li> <li><a href="http://www.modbargains.com/Cusco-Suspensions-Strut-Bars-Braces.htm">Cusco Suspensions</a></li> <li><a href="http://www.modbargains.com/UUC-Motorwerks-Performance.htm">UUC Motorwerks Performance</a></li> </ul> </div> <div style="clear:both"></div> <img id="ctl00_feLeft_dlSubmenuList_ctl04_ctl00_dlProductCategory_ctl00_imgArrow" src="Theme/02/c_arrow.gif" style="margin-left:6px;" border="0" /><a href="javascript:animatedcollapse.toggle('wheels')">Wheels</a> <div class="collapselist" id="wheels" style="width: 160px; display:none;"> <ul style="list-style:none; padding:2; margin:0;"> <li><a href="http://www.modbargains.com/Alufelgen-Wheels-BMW.htm">Alufelgen </a></li> <li><a href="http://www.modbargains.com/Avant-Garde-Wheels.htm">Avant Garde </a></li> <li><a href="http://www.modbargains.com/Axis-Wheels.htm">Axis </a></li> <li><a href="http://www.modbargains.com/BMW-Replica-Wheels.htm">BMW Replica </a></li> <li><a href="http://www.modbargains.com/EXE-Wheels.htm">EXE </a></li> <li><a href="http://www.modbargains.com/Forgestar-Wheels.htm">Forgestar </a></li> <li><a href="http://www.modbargains.com/iForged-Wheels.htm">iForged </a></li> <li><a href="http://www.modbargains.com/Miro-Wheels.htm">Miro </a></li> <li><a href="http://www.modbargains.com/TSW-Wheel.htm">TSW </a></li> <li><a href="http://www.modbargains.com/Ultra-Wheels.htm">Ultra </a></li> <li><a href="http://www.modbargains.com/VMR-Wheels.htm">VMR </a></li> <li><a href="http://www.modbargains.com/VW-Audi-Replica-Wheels.htm">Audi/VW Replica </a></li> <li><a href="http://www.modbargains.com/_e/dept/66/Linea_Corse_Wheels.htm">Linea Corse </a></li> <li><a href="http://www.modbargains.com/_e/dept/105/Mercedes_Replica_Wheels.htm">Mercedes Replica </a></li> </ul> </div> </body> |