Alex: Wie mache ich eine "Schublade"

Hallo,
ich habe vor eine "schublade" in eine website einzubauen. D.h. ich möchte dass wenn ich auf einen link oder ein bild (weis noch ned genau wies sein soll) klicke sich dann nach rechts eine art schublade öffnet. Also ein bissl grösserer kasten wo text drinnen steht.
Ich habe das mit JS schon so gemacht dass es wennich draufklicke einfach den Kasten visible macht aber es würde halt schöner aussehen wenn er dann so ausfährt wie eine schublade und nciht einfahc auf einmal da ist.

Ich hab sowas shcon gesehn aber ich hab leider keine ahnung wie ich es programmieren kann. Also wenn ihr mir villeicht helfen könntet - wär euch echt dankbar...

mfg
 Alex

  1. ich habe vor eine "schublade" in eine website einzubauen […] aber ich hab leider keine ahnung wie ich es programmieren kann.

    Alex,
    Ein animiertes GIF (1 Durchlauf) spart jede Programmiererei.

    Live long and prosper,
    Gunnar

    --
    „Weisheit ist nicht das Ergebnis der Schulbildung, sondern des lebenslangen Versuchs, sie zu erwerben.“ (Albert Einstein)
    1. @Gunnar
      Also ich kann mir nicht vorstellen wie das in meinem Fall funktionieren soll.
      Ich habe links eine Liste mit Links oder Bildern oder so und dann soll rechts immer ewas rausfahren. Das mit dem animierten Gif kann ich mir jetzt nur bei einem einzelnen vorstellen, oder wenn das Ausfahrende lgeichhoch wie der "link" wäre.
      Aber ich will ja dann nen grossen kasten haben der ausfährt...

    2. Hallo,

      Ein animiertes GIF (1 Durchlauf) spart jede Programmiererei.

      Du kannst den Start einer Gif-Animation nicht per JS steuern. Die Gif-Einzelbilder werden in der regel angezeigt, wie sie durchs Kabel angekommen sind. (Deswegen ist auch der erste Durchlauf nicht selten etwas hakelig....) - Mit seinem Problem hat ein Gif allerdings eh nichts zu tun....

      Chräcker

      --
      Erinnerungen?
      zu:]
  2. Moin!

    Vielleicht meinst Du ja sowas wie den Kalender auf der Startseite auf it-schule.de....

      
    <script type="text/javascript">  
    <!--  
      
    /* Konfiguration */  
    var intWaitTime = 15;  
    var intStepSize = 32;  
    var intEndSize  = 335;  
      
    /* Funktionen */  
    function heightUp() {  
      counter=0;  
      window.setTimeout('zaehler_up()', intWaitTime);  
    }  
      
      
    function zaehler_up() {  
      counter=counter+intStepSize;  
      newHeight=(counter)+"px";  
      document.getElementById('T_Liste').style.height = newHeight;  
      if (counter < intEndSize=335) {  
          window.setTimeout('zaehler_up()', intWaitTime);  
      }  
    }  
      
      
    function heightDown() {  
      counter=intEndSize;  
      window.setTimeout('zaehler_down()', intWaitTime);  
    }  
      
    function zaehler_down() {  
      counter=counter-intStepSize;  
      newHeight=(counter)+"px";  
      document.getElementById('T_Liste').style.height = newHeight;  
      if (counter > intEndSize=0) {  
          window.setTimeout('zaehler_down()', intWaitTime);  
      }  
    }  
    // -->  
    
    
      
    <body>  
      
    <a onclick="heightUp()">Öffnen</a>  
    <div id='T_Liste' style='height:0px;position:absolute;top:100px;left:100px;z-index:10'>  
    Pla...Blubb...Laber  
    </div>  
    </body>  
    
    

    Du müsstest das insofern anpassen, als dass Du eventuelle mehrere "Kästen hast" und diese eventuell auch noch schließen willst. Die 15 Millisekunden zwischen zwei "Rucks" (intWaitTime) sind frei wählbar, ebenso der Fortschritt (intStepSize) und die Endhöhe (intEndSize).

    MFFG (Mit freundlich- friedfertigem Grinsen)

    fastix®

    --
    Als Freiberufler bin ich immer auf der Suche nach Aufträgen: Schulungen, Seminare, Training, Development
    1. Hi,

      danke. Genau sowas habe ich gemeint :)
      Leider funktioniert das Script das du hier gepostet hat irgendwie nicht. Wenn ich auf den Link klicke kommt ein JS fehler der sagt dass in der Zeile: <a onclick="heightUp()">Öffnen</a>
      ein Objekt erwartet wird.
      Villeicht kannst du mir da wieterhelfen...

      mfg
        Alex

      1. Liebe(r) Alex,

        Du hast wahrscheinlich kein <div> mit der ID "T_Liste" in Deinem HTML?

        fastix hatte das in seinem Codebeispiel extra mit angegeben:

        <div id='T_Liste' style='height:0px;position:absolute;top:100px;left:100px;z-index:10'>
        Pla...Blubb...Laber
        </div>

        Liebe Grüße aus Ellwangen,

        Felix Riesterer.

        1. Hallo Felix,

          doch ich habe so ein <div>, habe ja das Codebeispiel von fastix ja ganz übernommen.
          ICh versteh nicht was da der Fehler sein kann :(

          Alex

          1. Hallo Alex,

            ICh versteh nicht was da der Fehler sein kann :(

            Fastix war wohl etwas in Eile ....
              Ein bischen </script> schadet nie.

            if (counter < intEndSize=335) müsste
              if (counter < intEndSize) sein

            wie auch: if (counter > intEndSize=0) als (counter > 0)
              gelesen werden muss.

            Dann sollte die Box noch einen Rahmen bekommen damit man sieht was sich tut.

            HTH

            Jochen

            --
            Heute schon gescribbelt?
            Scribbleboard
            1. Hallo Jochen,

              sorry das hätt ich eigendlich schrieben können: Ich habe schon das </script> reingemacht und auch einen Rahmen ins <div> eingebaut. Auch die Sachen in den if() teilen^^ habe ich schon ausprobiert.
              Aber es kommt immernoch der slebe fehler?!?

              Alex

              1. Hi Alex,

                Aber es kommt immernoch der slebe fehler?!?

                Dann ist in deinem script noch ein Fehler ...
                Ausgehend von fastix' Original mit den Korrekturen aus meinem Posting klappt alles

                Viele Grüße,

                Jochen

                --
                Heute schon gescribbelt?
                Scribbleboard
            2. Moin!

              Fastix war wohl etwas in Eile ....

              Warum nenne ich mich wohl ausgerechnet "fastix"? :)))

              MFFG (Mit freundlich- friedfertigem Grinsen)

              fastix®

              --
              Als Freiberufler bin ich immer auf der Suche nach Aufträgen: Schulungen, Seminare, Training, Development