Thanks for your quick response, but this doesn't seem to work. I've pasted all the code in bellow, thanks for your help
<!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>stripy divs</title> <style type="text/css"> @import"css/stripy_simple.css"; </style> <script type="text/javascript" src="jquery-1.3.2.min.js" ></script> <!--<script type="text/javascript"> $(function() { $('div').click(function() { $('div').hide("slow"); // first, for simplification hide any open divs (change specificity for your needs) $(this).show("slow"); // second, open the selected div }); }); </script>--> <script type="text/javascript"> $(document).ready(function() { $('div.me').hide(); $('div.who').toggle(function() { $(this).siblings('div.me').fadeIn(900); $('div.view').hide(); $('div.callme').hide(); $('div.imagesview').hide(); }, function() { $(this).siblings('div.me').fadeOut(500); return false; }); }); $(document).ready(function() { $('div.view').hide(); $('div.slide').toggle(function() { $(this).siblings('div.view').fadeIn(900); $('div.me').hide(); $('div.callme').hide(); $('div.imagesview').hide(); }, function() { $(this).siblings('div.view').fadeOut(500); return false; }); }); $(document).ready(function() { $('div.showwork').hide(); $('div.work').toggle(function() { $(this).siblings('div.showwork').fadeIn(900); }, function() { $(this).siblings('div.showwork').fadeOut(500); return false; }); }); $(document).ready(function() { $('div.callme').hide(); $('div.call').toggle(function() { $(this).siblings('div.callme').fadeIn(900); $('div.view').hide(); $('div.me').hide(); $('div.imagesview').hide(); }, function() { $(this).siblings('div.callme').fadeOut(500); return false; }); }); $(document).ready(function() { $('div.imagesview').hide(); $('div.images').toggle(function() { $(this).siblings('div.imagesview').fadeIn(900); $('div.view').hide(); $('div.me').hide(); $('div.callme').hide(); }, function() { $(this).siblings('div.imagesview').fadeOut(500); return false; }); }); </script> <script language="javascript">AC_FL_RunContent = 0;</script> <script src="js/AC_RunActiveContent.js" language="javascript"></ script> </head> <body> <div id="container"> <div id="subframe"> <div id="contentpane"> <div id="header"> <script language="javascript"> if (AC_FL_RunContent == 0) { alert("This page requires AC_RunActiveContent.js."); } else { AC_FL_RunContent( 'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/ flash/swflash.cab#version=9,0,0,0', 'width', '550', 'height', '48', 'src', 'stripy_ident', 'quality', 'high', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer', 'align', 'middle', 'play', 'true', 'loop', 'true', 'scale', 'showall', 'wmode', 'transparent', 'devicefont', 'false', 'id', 'stripy_ident', 'bgcolor', '#ffffff', 'name', 'stripy_ident', 'menu', 'true', 'allowFullScreen', 'false', 'allowScriptAccess','sameDomain', 'movie', 'stripy_ident', 'salign', '' ); //end AC code } </script> <noscript> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab#version=9,0,0,0" width="550" height="48" id="stripy_ident" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="stripy_ident.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><param name="bgcolor" value="#ffffff" /> <embed src="stripy_ident.swf" quality="high" bgcolor="#ffffff" width="550" height="48" name="stripy_ident" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"; /> </object> </noscript> </div> <!--<div id="stripes"> </div>--> <div id="sidebar"> GRAPHIC DESIGN </div> <div id="workhide" class="work"> </div> <!--ABOUT--> <div id="about" class="who"> </div> <div id="history" class="me divs"> <h4 class="heading">WINK</h4> <p>STRIPY EYE is a one person design compendium, Im an individual working on a freelance basis. My experience spans roughly ten years working in a variety of backgrounds from exhibition, print and web based media, to teaching at FE level and recently working in flash and 3d rendering. <br /> The site contains a selection of my work, illustrating a broad range of skills in communication media. <br /> <br /> If you wish to talk or simply seek advice about a project please contact me <br /> t...@stripyeye.com <br /><br /> If you would like further information about me, my cv is available as a download </p> </div> <!--PROCESS--> <div id="processbutton" class="slide"> </div> <div id="main" class="view"> <h4 class="heading"> PROCESS</h4> <div class="divfloats"> <b>Mind</b><br /> Our perceptions of something can be both enlightening and perplexing. We can present something that will communicate different things to different people. Unifying the perceptions of an idea is an important process that requires thought and a guiding hand on how it is received. It requires someone who can take the idea in hand and enrich it, so that it resonates in the receivers mind. </div> <div class="divfloats"> <b>Ears</b><br /> Listening to what you have to say about your design needs is of utmost importance. My approach is about listening to your needs and aspirations for the design and how best to launch it in the public domain. Without listening there is no presenting. </div> <div class="divfloats"> <b>Mouth</b><br /> Discussion and partnership through the process is equally important. It's essential to communicate and discuss each stage of the process and maintain constant correspondence throughout the implementation, ensuring the project grows in the right way for you. </div> <div class="divfloats"> <b>Eyes</b><br /> The work is there for all to see, so if we get the first three right the eyes will have it. Help me to help you present your idea to the world. </div> </div> <!--CONTACT--> <div id="contact" class="call"> </div> <div id="contactview" class="callme"> <h1>TALK</h1> <P> t...@stripyeye.com </P> <P> 07964 355 158 </P> </div> <!--STARTPICS--> <div id="pics" class="images"> </div> <div id="picsview" class="imagesview"> <p>This is me and I am here for you</p> </div> <div class="menu"> </div> <!--<div id="logo"> </div>--> <!--WORKFOLIO--> <div id="workspace" class="showwork"> Hello I am exposed!!!!!!! </div> <div id"footer"> </div> <!--CONTENTPANE-END--></div> <!---SUBFRAME--END----></div> <!--CONTAINER--END----></div> </body> </html> On Jan 12, 2:30 pm, bill <ozzi...@gmail.com> wrote: > without the corresponding html, it is hard to tell if this answer is > completely correct. however, think about trying this approach, where > these few lines replace ALL of your code: > > $(function() { > $('div').click(function() { > $('div').hide("slow"); // first, for simplification > hide any > open divs (change specificity for your needs) > $(this).show("slow"); // second, open the selected div > }); > > }); > > On Jan 12, 8:17 am, tabu <ces...@googlemail.com> wrote: > > > > > Hello, > > I'm new to javascript and jquery library, I have script running which > > functions fine only problem I have with it is that I want to close > > other divs when another is selected, I guess like an accordion style > > but using the toggle, slide fade-in functions. The problem I have is > > that once each button that controls the relevant div is clicked once, > > on subsequent clicks it requires double clicking to show the > > containing div, where i want a single. > > I imagine it is a very simple solution but I have tried a number of > > ways without success, any help would be great, thanks > > > Here is the script Im using: > > > $(document).ready(function() { > > $('div.me').hide(); > > $('div.who').toggle(function() { > > $(this).siblings('div.me').fadeIn(900); > > $('div.view').hide(); > > $('div.callme').hide(); > > $('div.imagesview').hide(); > > }, function() { > > $(this).siblings('div.me').fadeOut(500); > > return false; > > > }); > > > }); > > > $(document).ready(function() { > > > $('div.view').hide(); > > $('div.slide').toggle(function() { > > $(this).siblings('div.view').fadeIn(900); > > $('div.me').hide(); > > $('div.callme').hide(); > > $('div.imagesview').hide(); > > }, function() { > > $(this).siblings('div.view').fadeOut(500); > > return false; > > > }); > > }); > > > $(document).ready(function() { > > $('div.showwork').hide(); > > $('div.work').toggle(function() { > > $(this).siblings('div.showwork').fadeIn(900); > > }, function() { > > $(this).siblings('div.showwork').fadeOut(500); > > return false; > > > }); > > }); > > > $(document).ready(function() { > > $('div.callme').hide(); > > $('div.call').toggle(function() { > > $(this).siblings('div.callme').fadeIn(900); > > $('div.view').hide(); > > $('div.me').hide(); > > $('div.imagesview').hide(); > > }, function() { > > $(this).siblings('div.callme').fadeOut(500); > > return false; > > > }); > > }); > > > $(document).ready(function() { > > $('div.imagesview').hide(); > > $('div.images').toggle(function() { > > $(this).siblings('div.imagesview').fadeIn(900); > > $('div.view').hide(); > > $('div.me').hide(); > > $('div.callme').hide(); > > }, function() { > > $(this).siblings('div.imagesview').fadeOut(500); > > return false; > > > }); > > });
