Solved

simple show hide this div depending on id

Posted on 2012-04-01
4
440 Views
Last Modified: 2012-08-14
i have 10 div's.

i am looking for a simple javascript that allows me to do the following.

i have a menu bar that says;
div 1
div 2
div 3
etc.

when i click div1, i want it to show div 1, and hide all the rest because they do not have
the div id# div1

the catch is, i want it linked to the div's class or id name
basicly like a onclick=get.this type code

so example, when clicking on the div 1 link,
the div 1 link will show the div with that related link# and id# div1

hopefully that explains it all.

thanks
0
Comment
Question by:webdott
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 17

Accepted Solution

by:
sonawanekiran earned 300 total points
ID: 37794568
0
 
LVL 20

Expert Comment

by:BuggyCoder
ID: 37794850
var state=true;

$('document').ready(function() {
	$('div').click(function () {
		if(state == true) {
			$('div').hide();
			$(this).show();
			
			state = false;
		} 
		else {
			$('div').show();
			state = true;
		}
	})
})

Open in new window

0
 
LVL 16

Assisted Solution

by:HagayMandel
HagayMandel earned 200 total points
ID: 37795455
Your question is  not clear.
How can you hide divs and then click on them?
If you only want to get the div's data abs characteristics, check this sample: http://jsfiddle.net/EKZu3/
0
 

Author Closing Comment

by:webdott
ID: 37796112
Thank you both.

That is exactly what I am looking for.

HagayMandel - yours uses jquery which is nice to have that option.
I have to check to see if all mobile devices can use jquery. I believe
they can, I just have not checked into it yet.

Thanks again for the quick and exact answers!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Embedd an image or live dashboard into Slack 1 54
Anchor Bookmark 6 34
Change background images after 5 seconds. 12 46
CSS styling problem 3 27
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will learn how to count occurrences of each item in an array.

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question