hide script

[steffen]

Hi,
ich arbeite gerade an einem hidescript, allerdings wegen mangelnden Kenntnissen ises eher schleppend und viel Zeit hab ich fürs einarbeiten gerade leider auch nicht.
Also momentan habe ich das folgende:

<script type="text/javascript">
     function show(das){
        if(document.getElementById(das).style.display=='none') document.getElementById(das).style.display='block';
        else document.getElementById(das).style.display='none';}
</script>
.
.
.
text
<a href="javascript:show('updates');" class="show">mehr</a>
     <div style="display: none;" id="mehrtext">
        ganz viel mehr aber versteckter Text
     </div>

klappt soweit ja auch gut, nur hätte ich es gerne das beim klicken der "mehr"-Link durch "weniger" ersetzt wird, über den man das wieder verstecken kann bzw am besten wäre es wenn der Link dann am ende des "ganz viel mehr aber versteckter Text" erscheint.
mfg

[mbr]

Hallo Steffen,

Also momentan habe ich das folgende:

<script type="text/javascript">
     function show(das){
        if(document.getElementById(das).style.display=='none') document.getElementById(das).style.display='block';
        else document.getElementById(das).style.display='none';}
</script>
.
.
.
text
<a href="javascript:show('updates');" class="show">mehr</a>
     <div style="display: none;" id="mehrtext">
        ganz viel mehr aber versteckter Text
     </div>

klappt soweit ja auch gut, nur hätte ich es gerne das beim klicken der "mehr"-Link durch "weniger" ersetzt wird, über den man das wieder verstecken kann bzw am besten wäre es wenn der Link dann am ende des "ganz viel mehr aber versteckter Text" erscheint.

Möglichkeit 1: Du tauscht beim Anzeigen / Verstecken auch den Text des Links aus:

  
<script type="text/javascript">  
  function show(das){  
    if(document.getElementById(das).style.display=='none')  
    {  
       document.getElementById(das).style.display='block';         document.getElementsByName("show")[0].firstChild.data="weniger";  
    }  
    else  
    {  
      document.getElementById(das).style.display='none';  
document.getElementsByName("show")[0].firstChild.data="mehr";  
    }  
  }  
</script>  

Dabei musst du natürlich auch noch deinen Link ein name Attribut verpassen:

  
 <a href="javascript:show('updates');" class="show" name="show">mehr</a>  

Möglichkeit 2: Du versteckst beim Anzeigen des Divs den ersten Link und baust zusätzlich in das div noch einen zweiten Link ("weniger") ein, der das Div wieder versteckt und dann den ersten Link wieder anzeigt (Puh, hoffe, ich habe mich nicht zu kompliziert ausgedrückt).

Liebe Grüße

mbr

P.S.: habe das Skript sicherheitshalber nochmal ausgetestet. Bei mir funktioniert es nun, aber nur, wenn du auch die ID des divs auf "updates" setzt.

[Steffen]

Danke dir,
konnte deins so anpassen (+ wenig css spielerei) das jetzt alles so ist wie ich es mir wünsche. Nur in Opera hab ich jetzt den seltsamen effekt das bei 100% Seitenzoom (also Standard) die Seite etwas breiter wird beim "mehr" drücken und beim "weniger" wirds wieder normal, wenn ich rein oder rauszoome passiert das net und in FF oder IE ebenfalls nicht.

mfg