jquery click() problem, how to?

Question

i have this setup:

<script type="text/javascript">
$(document).ready(function() {
   $("#click_me_link").click(function () {
      $("#link_more").show("slow");
   });
});
</script>

<div id="click_me_link"><img src="/images/banner_bottom.png"></div>
<div id="link_more" style="width: 530px; height: 66px; display: none;">
   test
</div>

if i click on the click_me_link it wont display the hidden div. if i run $("#link_more").show("slow"); in the console it works

any idea? thanks semicolon fixed, still doesn't work

You missed a semicolon between the height and display properties in the link_more's style. Does that fix the issue? — Manuel Leuenberger
– Manuel Leuenberger, Commented Jun 22, 2011 at 23:39

John Kalberer · Accepted Answer · 2011-06-22 23:37:55Z

4

Yeah the issue is your css in link_more. You are missing a semicolon. It needs to be this:

width: 530px; height: 66px; display: none;

Anyway, you probably want to make click_me_link an anchor instead of a div and use e.preventDefault() inside your click event.

answered Jun 22, 2011 at 23:37

John Kalberer

5,8001 gold badge25 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Charles Caldwell Over a year ago

Actually, that wouldn't prevent the hidden div from showing. It would prevent it from being hidden in the first place.

John Kalberer Over a year ago

Yeah, that was the only issue I found when I moved it to jsfiddle. I am guessing the overall cause must be a browser issue.

Charles Caldwell Over a year ago

+1 For saying you should wrap the image in an anchor tag. This will make the web page more accessibility friendly for screen readers and any browser with JavaScript disabled.

Steve Robbins · Accepted Answer · 2011-06-22 23:41:24Z

1

It's working here http://jsfiddle.net/imoda/eXPW5/

You're missing a ; after the height property

<div id="link_more" style="width: 530px; height: 66px display: none;">

Not sure if that's causing your problem as I can't seem to replicate it, but it's no doubt something to fix.

answered Jun 22, 2011 at 23:41

Steve Robbins

13.8k12 gold badges81 silver badges129 bronze badges

2 Comments

Charles Caldwell Over a year ago

There's no way that would be the answer. See my comment on John Kalberer's answer. Missing a semicolon would prevent the DIV from being hidden. It would not prevent it from being shown upon a click event. It would cause the exact opposite of the problem stated!

Steve Robbins Over a year ago

I agree. My guess is that there are other things at play that are having some sort of effect. Going off what OP has provided, this doesn't fix what he's talking about.

jterrace · Accepted Answer · 2011-06-22 23:39:00Z

1

You were missing a semi-colon after "66px". Other than that, your example is working for me.

Here is a working jsfiddle: http://jsfiddle.net/Mm9AQ/

answered Jun 22, 2011 at 23:39

jterrace

67.5k24 gold badges164 silver badges208 bronze badges

Collectives™ on Stack Overflow

jquery click() problem, how to?

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related