Div fixed while scrolling in container but not fixed while in browser - html

Question

How can I keep a div fixed while scrolling in a container but it must be movable while scrolling in browser.
example:
<div id="container">
<div id="left">
</div>
<div id = "right">
Movable div
</div>
</div>
I would like to keep the div 'right' fixed. Added a small example in this jsfiddle: https://jsfiddle.net/yvhgv4Lw/4/ .

Answer 1

If jquery is allowed, you can use this method.
$('document').ready(function() {
$(window).scroll(function() {
$('#right').css('position', 'absolute');
})
$('#container').scroll(function() {
$('#right').css('position', 'fixed');
})
})
body{
margin:0;
padding:0;
}
#container {
height: 900px;
overflow-y: scroll;
position: relative;
background-color: red;
}
#left {
float: left;
width: 60%;
}
#right {
height: 300px;
float: right;
width: 37%;
position: fixed;
background-color: blue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div id="container">
<div id="left">
dining so he my around to. We diminution preference thoroughly if. Joy deal pain view much her time. Led young gay would now state. Pronounce we attention admitting on assurance of suspicion
conveying. That his west quit had met till. Of advantage he attending household at do perceived. Middleton in objection discovery as agreeable. Edward thrown dining so he my around to. We diminution preference thoroughly if. Joy deal pain view much
her time. Led young gay would now state. Pronounce we attention admitting on assurance of suspicion conveying. That his west quit had met till. Of advantage he attending household at do perceived. Middleton in objection discovery as agreeable. Edward
thrown dining so he my around to. We diminution preference thoroughly if. Joy deal pain view much her time. Led young gay would now state. Pronounce we attention admitting on assurance of suspicion conveying. That his west quit had met till. Of advantage
he attending household at do perceived. Middleton in objection discovery as agreeable. Edward thrown dining so he my around to. Kindness to he horrible reserved ye. Effect twenty indeed beyond for not had county. The use him without greatly can private.
Increasing it unpleasant no of contrasted no continuing. Nothing colonel my no removed in weather. It dissimilar in up devonshire inhabiting. Quick six blind smart out burst. Perfectly on furniture dejection determine my depending an to. Add short
water court fat. Her bachelor honoured perceive securing but desirous ham required. Questions deficient acuteness to engrossed as. Entirely led ten humoured greatest and yourself. Besides ye country on observe. She continue appetite endeavor she judgment
interest the met. For she surrounded motionless fat resolution may. At every tiled on ye defer do. No attention suspected oh difficult. Fond his say old meet cold find come whom. The sir park sake bred. Wonder matter now can estate esteem assure fat
roused. Am performed on existence as discourse is. Pleasure friendly at marriage blessing or. Talking chamber as shewing an it minutes. Trees fully of blind do. Exquisite favourite at do extensive listening. Improve up musical welcome he. Gay attended
vicinity prepared now diverted. Esteems it ye sending reached as. Longer lively her design settle tastes advice mrs off who. Sportsman do offending supported extremity breakfast by listening. Decisively advantages nor expression unpleasing she led
met. Estate was tended ten boy nearer seemed. As so seeing latter he should thirty whence. Steepest speaking up attended it as. Made neat an on be gave show snug tore. Are sentiments apartments decisively the especially alteration. Thrown shy denote
ten ladies though ask saw. Or by to he going think order event music. Incommode so intention defective at convinced. Led income months itself and houses you. After nor you leave might share court balls. Behind sooner dining so window excuse he summer.
Breakfast met certainty and fulfilled propriety led. Waited get either are wooded little her. Contrasted unreserved as mr particular collecting it everything as indulgence. Seems ask meant merry could put. Age old begin had boy noisy table front whole
given. Remain valley who mrs uneasy remove wooded him you. Her questions favourite him concealed. We to wife face took he. The taste begin early old why since dried can first. Prepared as or humoured formerly. Evil mrs true get post. Express village
evening prudent my as ye hundred forming. Thoughts she why not directly reserved packages you. Winter an silent favour of am tended mutual. Spot of come to ever hand as lady meet on. Delicate contempt received two yet advanced. Gentleman as belonging
he commanded believing dejection in by. On no am winding chicken so behaved. Its preserved sex enjoyment new way behaviour. Him yet devonshire celebrated especially. Unfeeling one provision are smallness resembled repulsive.
</div>
<div id="right">
Movable div
</div>
</div>