Ok, the easiest way would be to have both of those, but hide one and show the other... then when it changes, show one and hide the other.
You can do that by wrapping each in their own element, like a span with an id. Then hide one by default with a CSS class. When you click the one thats shown, change the class on the hidden one to make it show up, and then change the class on the one you clicked to hide it. They should appear to be just one link that updates.
Something like this... this may not work but it should help to get you close.
Code:
<style>
.hidden {
display: none;
}
</style>
<div align="center">
<span id="downlink" class="style11"><a href="#" onclick="Effect.BlindUp('d1'); $( 'downlink' ).addClassName( 'hidden' ); $( 'uplink' ).removeClassName( 'hidden' ); return false;" >Slide Down</a></span>
<span id="uplink" class="style11 hidden"><a href="#" onclick="Effect.BlindDown('d1'); $( 'downlink' ).removeClassName( 'hidden' ); $( 'uplink' ).addClassName( 'hidden' ); return false;">Slide Up</a></span>
</div>