SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2010
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    slideToggle Word Change

    i have the following jquery code:

    Code JavaScript:
    $(document).ready(function(){
      $(".showhide").click(function(){
        $(".slidingDiv").slideToggle(1000);
      });
    });

    this has a <div class="showhide"> which has the current text 'click here to expand/contract', which expands a <div class="slidingDiv"> or collapses it, whether it is open or closed. is there a way i can ammend this code so when the .slidingDiv is hidden, the div 'showhide' says 'click here to expand' and when .slidingDiv is shown, change the div 'showhide' to say 'click here to close'?

  2. #2
    SitePoint Enthusiast
    Join Date
    Dec 2010
    Posts
    30
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, figured this out with some more searching, see below:

    Code JavaScript:
    $(document).ready(function(){
     
    $(".showhide").click(function() {
      $(".slidingDiv").slideToggle(1000, function() {
        $(".showhide").text($(this).is(':visible') ? "Hide" : "Show");
      });
    });
    });

    anybody know how i can integrate a fade in to this?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •