Jump to content

help with jquery conditional statement


CyberShot

Recommended Posts

I built a slider with four links. when you click the next link, the next page slides up from the bottom. and the previous page gets hidden. All is good. Here is a code sample. All the pages are the same

 

$("#aboutPage").click(function(){
	$("#headerBottom p:eq(4)").hide();
	$("#content span").slideUp();
	$("#content span:eq(1)").slideDown(); 
	$("#headerBottom p").hide();
	$("#headerBottom p:eq(0)").show();
 });

  when you click the anchor link with the id of aboutPage, I first hide some text inside a P tag with the index of 4, then make any content inside the span tag slideUp to hide all previous content, then slideDown the content I want. In this example, it's the about content. Then I hide a message in the header and show a different one.

 

what I need is a conditional statement that says if I am already showing this content, then to unbind the click event so that they page doesn't slide every time you press the about link when you are on the about page.

 

Here is what I have been trying

if($("#content span:eq(1)").is(':visible'))
{
	$("#aboutPage").unbind("click");
}

 

Link to comment
https://forums.phpfreaks.com/topic/183697-help-with-jquery-conditional-statement/
Share on other sites

well, I got it partially figured out I think. My content is simple. about page, work page, social page, and contact page.  each page is in a div

 

div id="about"

div id="work"

div id="social

div id="contact"

 

I wrapped every div in a span so that I would not need  the exact id of the div in order to hide it. I could just do $(span).hide() and every div would be gone. So now I did this

 

 


$("#aboutPage").click(function(){
	if($("#content span:eq(1)").is(':visible'))
	{
	$("#aboutPage").unbind("click");
	} else {
	$("#headerBottom p:eq(4)").hide();
	$("#content span").slideUp();
	$("#content span:eq(1)").slideDown(); 
	$("#headerBottom p").hide();
	$("#headerBottom p:eq(0)").show();
	}
 });

 

when I click the about nav link that hs the id aboutPage, the page does not slide again, however, I can not go back to it once I leave it. everything works fine until i go back to the about page and click the about link a second time. I can go to any other page, just not the about page again.

 

http://www.creativeeventsdesign.com/vCard

 

try it out

figured it out. changed to this

 


$("#aboutPage").click(function(){
	if($("#content span:eq(1)").is(':visible'))
	{
	$("#aboutPage").show();
	} else {
	$("#headerBottom p:eq(4)").hide();
	$("#content span").slideUp();
	$("#content span:eq(1)").slideDown(); 
	$("#headerBottom p").hide();
	$("#headerBottom p:eq(0)").show();
	}
 });

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.