CODEWITHSUNDEEP
javascriptjquerydomhideshow-hide
junky
junky

Reputation: 1478

jquery - can make text disappear but can't make hidden text visible

The link to hide text works, but the link to .show the hidden text doesn't show it and I don't see any errors. See jsfiddle at: http://jsfiddle.net/tv6WQ/

<head>
<style type="text/css">   
    #shortandlong {color:red}   
    #thestory {visibility:hidden} 
</style>
</head>
<body>
    <span id="shortandlong">This is the short version but click </span><a href="#" id="showme">here...</a><span id="thestory"> now this is the full version</span><br/>
<span id="hideit">This text can be hidden </span>by clicking here <a href="#" id="hideme">here</a><br/>

</body>

js:

  $(document).ready(function () 
    { $('#hideme').click(function() 
      { $('#hideit').hide('fast');     
        return false;     } );    
      $("#showme").click(function() 
      { $('#thestory').show;     
        alert('Hello World');     
        return false;     } );    
    } );

Upvotes: 0

Views: 1199

Answers (4)

vol7ron
vol7ron

Reputation: 42139

Two things:

  1. show() is a function so you need parentheses
  2. hide/show change the display property, not the visibility - so change $('#thestory').show to $('#thestory').css('visibility','visible')

Upvotes: 1

Michael Rice
Michael Rice

Reputation: 1183

Your aren't calling the method. Add parenthesis after. E.g. .show();

Upvotes: 0

zerkms
zerkms

Reputation: 255005

.1. 

$('#thestory').show()

not

$('#thestory').show

.2. Replace visibility:hidden with display: none; or change the visibility by $('#thestory').css('visibility', 'visible');

http://jsfiddle.net/pxStN/

Upvotes: 3

Andreas Wong
Andreas Wong

Reputation: 60574

You have a typo, it should be show() in 

 $("#showme").click(function() 
      { $('#thestory').show;

Upvotes: 0

Related Questions