[jQuery] Re: jQuery text toggle effect

[Mauricio (Maujor) Samy Silva]

Please:
1-) Wrap "Show" within a span element.
2-) Get rid of the style atributte for the ul. ul's are block level elements by 
default.

<div class="showhide">
<span>Show</span>
<ul class="clients">
<li></li>
...

3-) And here goes the code;

$(".showhide").click(function() {
    $(this).children(".clients").slideToggle('slow');
      var currentText = $('span', '.showhide').text() 
        if (currentText == 'Hide') { 
           $('span', '.showhide').html('Show') 
       } else { 
          $('span', '.showhide').html('Hide') }  
});

Maurício


  -----Mensagem Original----- 
  De: mojoeJohn 
  Para: jQuery (English) 
  Enviada em: sexta-feira, 19 de junho de 2009 11:02
  Assunto: [jQuery] jQuery text toggle effect



  So i was looking on here yesterday, and i've been scouring the Web for
  a simple text toggle tutorial. I haven't been able to find one --
  maybe i'm not looking in the right places, but anyway. so you can
  probably tell what i'm trying to achieve just by my subject line.

  I have a div of images called .clients wrapped in a div
  called .showhide

  <div class="showhide">
  Show
  <ul class="clients" style="display: block;">
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <noscript>This is the description for the logo</noscript>
  </ul>
  </div>


  here's the jQuery that runs when i click .showhide

  $(".showhide").click(function(){
        $(this).children(".clients").slideToggle('slow');
  });


  just a simple slideToggle of the images on the click of the .showhide
  class. nothing new there.

  i tried a couple of things, but i don't know enough about jQuery yet
  to do this correctly.
  the best i could do was to have the text change after i
  click .showhide, but then the .slideToggle became disabled after the
  text changed.

  obviously, i want the text to toggle the words "show" and "hide" in
  accordance to the slide toggle.

  i have a hunch that i need to write an if/then statement using
  the .html feature to change the text itself and maybe even a variable
  for the show and a variable for the hide so i can pass them through
  with ease.

  can anyone help me?! am i on the right track?!


  thanks,

  John