473,412 Members | 2,051 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,412 software developers and data experts.

When show a div hide others with navigation

I have a topnavigation with some links and I have some hidden contentfields.
When I click on a link it animates the selected contentfield from bottom:-600 to bottom:0.
When I click on a other link, an other contentfield shows, **but I need it to hide the other..**


This is my site http://tiny.cc/3zppqw where the contentfields do pop up correct, but don't hide after clicking a other link.

Sorry, I'm a rookie/noob.


Is there anyone who can help me out?


I tried to make a fiddle: http://jsfiddle.net/fourroses666/8y7Sr/75/

Script:

Expand|Select|Wrap|Line Numbers
  1.     $(function() {
  2.             $('#activator-bureau').click(function(){
  3.                 $('#overlay-bureau').fadeIn('fast',function(){
  4.                     $('#box-bureau').animate({'bottom':'0px'},800);
  5.                 });
  6.             });
  7.             $('#boxclose-bureau').click(function(){
  8.                 $('#box-bureau').animate({'bottom':'-600px'},800,function(){
  9.                     $('#overlay-bureau').fadeOut('fast');
  10.                 });
  11.             });
  12.         });
Source

Expand|Select|Wrap|Line Numbers
  1. <div class="reference"> <a id="activator-werkwijze" class="activator">werkwijze</a> <a id="activator-bureau" class="activator">bureau</a> </div> <div class="box" id="box-bureau"> <a class="boxclose" id="boxclose-bureau">x</a> <div class="slidewrap">Some info...</div> </div> <div class="box" id="box-werkwijze" style="bottom:-300px;"> <a class="boxclose" id="boxclose-werkwijze">x</a> <div class="slidewrap">Some info 2...</div> </div>
Jan 20 '13 #1
3 1773
Anas Mosaad
185 128KB
You may add a specific class name (i.e. current) to the currently displayed box. For example, you would create a function named resetCurrent that selects the current box with the current css class and reset its position or fade it out, then fadeIn your new box.
Jan 21 '13 #2
i'm a rookie, i can't script myself, just grabbin code from the web. managed to get the fiddle work a bit better.

http://jsfiddle.net/fourroses666/8y7Sr/83/

hope anyone can help.
Jan 21 '13 #3
new fiddle, it almost works, first two links are ok, others notyet :(
http://jsfiddle.net/fourroses666/8y7Sr/100/
Jan 22 '13 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: Ajai Kumar .R | last post by:
Hai all, I've two or more forms on my app. My requirement is, Have to show the first form asa the user press a button have to hide the first form and show the second form. If the user press the...
5
by: Steve | last post by:
Visual Studio 2003 C# Windows: I have a tree view control as my main menu control down the left side of my application. This has 2 Parent Nodes on it (Jobs and Employees). beneath these 2 main...
5
by: Ray | last post by:
Hi, I was wondering if anyone has any idea how this can be done. I am trying to show/hide navigation links based on server names or ip addresses. So if, someone visits a particular url/ip address...
4
by: itunes66 | last post by:
how can i do this i already have a function to show/hide elements with one link but how can i show/hide multiple elements here is the script function obj_ref(object) { if...
1
by: Patrick Olurotimi Ige | last post by:
On http://msdn.microsoft.com/library/default.asp on the left pane u have :-Hide TOC and Show TOC When in Hide TOC it gives the user to see the whole page.. Any samples on how to implement that.. ...
4
by: bridgemanusa | last post by:
Hi All: I have a very long page of html that I want to take portions and hide them in divs, then show when a link is clicked. I have the hide show part working when the link is clicked, however...
3
by: | last post by:
I'm using the DataList and GridView controls, and I am trying to wrap my head around the problem of conditionally showing or hiding cells/cell content based on the presence or absence of DB data. I...
1
by: asilverpeach | last post by:
Hey Guys! Found some great scripts here on this topic but have to make to changes to the code that I can't seem to figure out. First, In the following code clicking on the headers shows the...
1
by: pamate | last post by:
hi, I want to show hide layers. I am able to show and hide layers but i am facing problem that, cant view the cursor in Mozilla,but i can type in input text box, its overlapping the layers. ...
6
by: Ralph | last post by:
Hi, I was reading effictive C++ and some other books again and they all tell you about hiding implementation details (proxy/pimpl/inheritance) but they never really explain when to use it. I...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.