Ergebnis 1 bis 4 von 4

Thema: jQuery Horizontaler Slider - Plugin-Suche

  1. #1
    Neuer Benutzer
    Registriert seit
    30.07.2011
    Beiträge
    19

    jQuery Horizontaler Slider - Plugin-Suche

    Hallo jQuery-Fans,

    ich bin auf der Suche nach etwas, dessen Name ich nicht kenne, also nicht verprügeln,
    wenn das hier schonmal durchgekaut wurde.

    Also ich hab mir ein nettes Feature für meine Bewerbungswebsite (Demo hier: http://bewerbung.clemensplainer.com/)
    gewünscht/erhofft:

    Der Text (rechter Bereich) soll "eingeflogen" werden, also eine Art horizontaler Slider. Aber natürlich ohne, darauf zu klicken,
    also mit dem Laden der Seite.

    Gibt es dafür bereits ein Plugin? Und wenn ja, welches? ?=)

    Vielen Dank für Eure Hilfe,
    Clemens Plainer

  2. #2
    Erfahrener Benutzer
    Registriert seit
    01.10.2010
    Ort
    Ludwigshafen
    Beiträge
    713
    Da brauchst du doch kein Plugin für.
    Befass dich mal mit .animate()

    Setzt deinen container auf position:relative.
    Danach gibst du deinem content per jQuery .css() position:absolute und ein negatives right von der Breite des Contents, und animierst diesen anschließend auf right:0:

    Code:
    $(function(){
    w = -($('#content').width());
    $('#content').css({"right":w+"px"});
    $('#content').animate({"right":0});
    });

    http://jsfiddle.net/fpvz/EtAxm/

    Gruß
    Geändert von zeji (18.10.2011 um 10:01 Uhr)

  3. #3
    Neuer Benutzer
    Registriert seit
    30.07.2011
    Beiträge
    19
    Zitat Zitat von zeji Beitrag anzeigen
    Da brauchst du doch kein Plugin für.
    Befass dich mal mit .animate()

    Setzt deinen container auf position:relative.
    Danach gibst du deinem content per jQuery .css() position:absolute und ein negatives right von der Breite des Contents, und animierst diesen anschließend auf right:0:

    Code:
    $(function(){
    w = -($('#content').width());
    $('#content').css({"right":w+"px"});
    $('#content').animate({"right":0});
    });


    http://jsfiddle.net/fpvz/EtAxm/

    Gruß
    Danke mal für den Code, aber so bring ich das noch nicht ganz hin =)
    Kann den Content nicht absolut setzten, da ich das ganze ja in einem zentrierten Layout habe, wie im Link zu sehen...
    Wie muss ich das denn dann machen? Bin leider sowas von schlecht mit jQuery - echter Nachholbedarf..

    Merci

  4. #4
    Neuer Benutzer
    Registriert seit
    30.07.2011
    Beiträge
    19
    Okay, jetzt hab ichs doch alleine hingebracht =)

    Code:
            $(document).ready(function(){
                $('#content').animate({"width":540});
            });
    Und halt vorher im css width auf 350 festsetzten, dann wirds von 350 auf 540 animiert.
    aber so gefallen tuts mir jetzt gar nicht mehr =)

    lg

Stichworte

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •