slideToggle Word Change

JavaScript
1

i have the following jquery code:

$(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

ok, figured this out with some more searching, see below:

$(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?