JQuery animate mehrmals das selbe Atribut

html.de-Forum JavaScript
1

Guten Abend
gibt es eine schöne Möglichkeit dieses Problem zu lösen?
[HTML] $(„#rfidPage #menu“).animate({
height:„5vw“,
height:„+=4vh“
},500);[/HTML]

2

das geht leider auch nicht
[HTML] $(„#rfidPage #menu“).animate({
height:„5vw“
}, {
duration: 500,
queue: false,
complete: function() {}
});
$(„#rfidPage #menu“).animate({
height:„+=4vh“
}, {
duration: 500,
queue: false,
complete: function() {}
});[/HTML]

3

das geht leider auch nicht

$("#rfidPage #menu").animate({ height:"calc(5vw+4vh)" },500);

4

Zuerst sollten wir mal wissen, was du überhaupt vorhast, dänn lässt sich sicherlich was finden :slight_smile:

5

ich würde gerne eine Animation von
height: 100vh zu
height: calc(5vw+4vh) machen.

6

Funktioniert, wenn height in Anführungszeichen gesetzt wird:

$("#rfidPage #menu").animate({ "height": "+=4vh" }, { duration: 500, queue: false, complete: function() {} });

7

das Problem ist nicht das height sondern beide Animationen in Kombination

8

[code=jQuery](function animation() {
var options = {
duration: 500,
easing: ‚linear‘
};

$(‚#rfidPage‘)
.find(‚#menu‘)
.animate({
height: „5vw“
},
options
)
.animate({
„height“: „+=4vh“
},
$.extend(true, {}, options, {
complete: function() {
animation();
}
})
);
})();[/code] https://jsfiddle.net/spicelab/LjfqL96m/

9

Hey spicelab danke für deine Antwort
es geht nicht darum das es am ende so rauf und runter geht sondern einfach die css position height:„calc(5vw+4vh)“ einnimmt

habe es jetzt so gelöst :smiley: auch wenn es etwas ge cheatet ist aber naja sieht auch ok aus
[HTML] $(‚#rfidPage #menu‘).animate({
height: „5vw“
},500).animate({
„height“: „+=4vh“
},500);[/HTML]

10

OK, wollte mit meinem JSFiddle auch nur zeigen, wie sich mehrere .animate()-Instanzen für ein Objekt koppeln lassen. Die „Schleife“ war just-for-fun :smiley: