Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

simple show hide this div depending on id

Posted on 2012-04-01
4
Medium Priority
?
498 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
4 Comments
 
LVL 17

Accepted Solution

by:
sonawanekiran earned 1200 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 800 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

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
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…
Suggested Courses

916 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