1

I'm doing research on this topic by the last day but i have not found any solution. i'm badly stuck in my project. Please someone help me to out.

My related search is Can I position an element fixed relative to parent?.

But this is not able to fulfill my will.

Community
  • 1
  • 1
Sushil Gaur
  • 91
  • 1
  • 8

1 Answers1

5

I made a JSFiddle for this.

What you want specifically is position:relative; on the parent and position:absolute; on the child element you want to position.

(Then set the position of the child element)

EDIT

New JSFiddle using jQuery UI .position()

HTML

<div class="anchor">
    <div class="content">
    </div>
    <button class="fixed-button">Fixed position button</button>
</div>

JavaScript

$(function(){
    $(".fixed-button").each(function(arg, el){
        $(el).position({
            of:  $(el).closest(".anchor")[0],
            my:  "left top",
            at:  "left+500 top+10"
        });
    });
});

EDIT 2

I just realized that this can be done by CSS only now that we have the "anchor" surrounding the content and the button. See this new and (hopefully) final JSFiddle

CSS

.anchor{
    position: relative;
}

.fixed-button{
    position: absolute;
    top: 10px;
    right: 50px;
}
Arg0n
  • 8,283
  • 2
  • 21
  • 38