Ankündigung

Einklappen
Keine Ankündigung bisher.

jQuery (slideToggle)

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    jQuery (slideToggle)

    hello folks!

    habe da ein zwei fragen und da ich weiss das hier auch ein paar html/javascript profis sitzen wende ich mich direkt an die elite bevor ich mir auf irgendeiner mehr themenbezogenen seite einen account erstellen muss und dann vermutlich nichtmal so qualifizierte antworten bekomme ;) :P

    also, erste frage bezieht sich auf sldeToggle bzw fadeToggle. funktioniert alles prima, nur wenn ich meinen "slide content" nun eine feste breite gebe springt er beim aufklappen ab einem gewissen punkt. also er fängt normal an zu sliden aber ab diesem punkt slidet er nicht mehr sondern zeigt den content instant an. beim zuklappen macht er es ganz normal. hier mal mein code:

    Spoiler: 

    HTML




    aiusdhiuasudi adijasd asaiusdhiuasudi adijasd as aiusdhiuasudi adijasd as





    mehr


    CSS
    #slide_content {
    background: #a0a09f;
    font-size:12pt;
    }

    .slide_div {
    margin: 0;
    padding: 0 35px 0 0;
    background: url(images/slide_btn.jpg) no-repeat center top;
    float:right;
    }
    .slide_button {
    font-size:0.5em;
    text-align: center;
    width: 154px;;
    display: block;
    color: #fff;
    text-decoration: none;
    }

    #toggle {
    font-size:0.5em;
    width:500px;
    height:500px;
    padding:5px;
    }




    jemand eine idee? muss es leider in den neuen div-toggle bauen da ich sonst probleme mit dem rest der seite bekomme (weil unschöner code^^)

    #2
    Schau dir mal .animate() an. Du legst per CSS ne Breite und Höhe von 0 fest und per JQuery.animate() kannste dann die Größe auf 500x500px vergrößern. Außerdem kannste da glaub ich auch die opacity anpassen. Also opacity erst 0 und Endwert dann 1. Das sollte einen "schöneren" Slide ergeben.

    EDIT: Grundcode in etwa so:

    if(width==500)
    {
    div.animate([ width=0 -> width=500, height=0 -> height=500, opacity=0 -> opacity=1 ]);
    }
    else
    {
    div.animate([ width=500 -> width=0, height=500 -> height=0, opacity=1 -> opacity=0 ]);
    }

    EDIT2: Sollte klar sein, dass die Syntax anders ist. :D

    Kommentar


      #3
      Aus Zeitgründen(unseren) solltest du die Problemseite irgendwo hochladen das man sich es direkt anschauen kann.

      Kommentar


        #4
        Wo ist dein jQuery script?

        Kommentar

        Lädt...
        X