Zurücksetzen des Wagens auf die ursprüngliche Position nach dem Scrollen nach unten

Question

Ich habe einen festen Einkaufswagen, der perfekt funktioniert. Beim Laden der Seite wird der Warenkorb 350px vom oberen Rand der Seite positioniert, nach dem Scrollen 350px die Seite nach unten wird der Einkaufswagen auf der Seite fixiert, mein Problem ist der Einkaufswagen in der Rolle nach oben der Warenkorb geht den ganzen Weg zurück nach oben der Seite, anstatt zu seiner ursprünglichen Position zurückzukehren.

Wie mache ich das?

$(window).on("scroll", function() { 
 
      if($(window).scrollTop() > 350) { 
 
       $("#stickycart").css("margin-top", "0","right",$(window).scrollTop()); 
 
       
 
      } 
 
     });

#stickycart{ 
 
    width: 25%; 
 
    float:right; 
 
    margin: 20px; 
 
    margin-top:450px; 
 
    float:right; 
 
    right:0; 
 
    top:0; 
 
    margin-right: 4%; 
 
     
 
    position: fixed; 
 
}

<div id="stickycart"> 
 
      <p id='order'>My Order</p> 
 
      <p id='estimated'>Average Delivery <br> 
 
       <b id='avg'><?php echo $avg_del ?></b><br> minutes</p> 
 
      <div id="prods_here"> 
 
       <!-- PLACE PRODUCTS HERE--> 
 
<?php cart(); ?> 
 
      </div> 
 
     </div>

Answer 1

ich nicht Konsistenz in Ihrem Code finden kann, weil #stickycart in Ihrem HTML nicht vorhanden ist. Dies ist jedoch wahrscheinlich, was Sie wollen: http://codepen.io/anon/pen/jqdYVd

Answer 2

Ich werde dies vorschlagen, wenn Sie die Möglichkeit haben, den Warenkorb als absoluter Artikel zu verwenden:

https://jsfiddle.net/6trq2mg0/2/

CSS:

#cart { 
    position: absolute; 
    top: 350px; 
    right: 0; 
} 

Skript:

$(window).on("scroll", function() { 
    if ($(window).scrollTop() > 350) { 
     $('#cart').css({"position" : "fixed", "top" : "0"}); 
    } else { 
     $('#cart').css({"position" : "absolute", "top" : "350px"}); 
    } 
});