ilch Forum » Ilch Clan 1.1 » Module und Modifikationen » Jquery Silder statt klick mouseover

Geschlossen
  1. #1
    User Pic
    69er Mitglied
    Registriert seit
    24.11.2011
    Beiträge
    51
    Beitragswertungen
    0 Beitragspunkte
    Hallo

    Ich möchte gerne den ts slider ändern.

    Statt klick möchte ich gerne mouseover und mouseout haben.

    Rechts habe ich den TS Slider und links möchte ich gerne 4 kleine slider (für Facebook, Steam usw.) erstellen die mit mouseover funktioniern.

    wie kann ich das verwirklichen.

    Ich kenne mich mit jquery garnicht aus habe es versuch habe einfach ".click(function(){" in ".mouseover(function(){" umgeändert aber dies funktioniert nicht weil dann der rechte ts slider nicht mehr funtz.




    <div id="login_slider" class="login_slider" style=" right: 0px; width: 70px; position: fixed; top: 100px;
    background:url(/include/images/tsslider/slider-black.png) repeat scroll 0% 0% transparent; height: 700px; z-index: 999;" >
                 
    <div style=" margin-top:20px; margin-left:80px; text-align:left; height: 650px; overflow:auto; overflow-x: hidden";;>
          {_boxes_tsviewer}
          </div>
          </div>
      <script type="text/javascript">
      var state = 0;
      var wait = false;
    
      function changeSlider()
      {
        if(state==1){
            $('#login_slider').animate({width: 70 }, "slow", function(){state = 0;}
            );
          }
        else
            $('#login_slider').animate({width: 300 }, "slow", function(){state = 1;}
          );
          }
          $('#login_slider').click(function(){
          changeSlider();
        });
          </script>
    
    <!-- Teamspeak Slider Code -->
    
    
    <!-- Facebook Slider Code -->
    
    
    <div id="fb" class="fb" style=" left: -258px; width: 310px; position: fixed; top: 125px;
    background:url(/include/images/tsslider/fb.png) repeat scroll 100% 0% transparent; height: 42px; z-index: 999;"  >
                 
    <div id="fb" style="position:absolute;top:20pt;right:46pt;width:190px;height:40px;overflow: hidden;"> 
         
          </div>
          </div>
      <script type="text/javascript">
      var state = 0;
      var wait = false;
    
      function changeSlider()
      {
        if(state==1){
            $('#fb').animate({width: 308 }, "slow", function(){state = 0;}
            );
          }
        else
            $('#fb').animate({width: 521 }, "slow", function(){state = 1;}
          );
          }
          $('#fb').click(function(){
          changeSlider();
        });
          </script>
    
    <!-- Facebook Slider Code -->



    MfG MRBD69


    verwendete ilch Version: 1.1 P

    betroffene Homepage: externer Link
    MfG 69er
    0 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    Mairu Coder
    Registriert seit
    16.06.2006
    Beiträge
    15.334
    Beitragswertungen
    386 Beitragspunkte
    Also nur so, wenn du viele Javascriptblöcke hast (<script>...</script>) bietet es sich an, diese zu vereinigen.

    Hab mal ein bisschen rumgespielt und eine wiederverwendbare Funktion für die Slider geschrieben.

    jsfiddle.net/e7cj4/1/


    Zuletzt modifiziert von Mairu am 26.03.2014 - 07:29:30
    Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
    1 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Module und Modifikationen

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten