修正两个高度之间的div位置

时间:2015-04-24 08:20:50

标签: javascript jquery css

我有一个div,我想在两点之间滚动时保持<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <soapenv:Header/> <soapenv:Body> <GetOrdersResponse xmlns="urn:ebay:apis:eBLBaseComponents"> <Timestamp>2015-04-24T07:03:42.662Z</Timestamp> <Ack>Success</Ack> <Version>915</Version> <Build>E915_CORE_API_17441756_R1</Build> <PaginationResult> <TotalNumberOfPages>0</TotalNumberOfPages> <TotalNumberOfEntries>0</TotalNumberOfEntries> </PaginationResult> <HasMoreOrders>false</HasMoreOrders> <OrderArray/> <OrdersPerPage>100</OrdersPerPage> <PageNumber>1</PageNumber> <ReturnedOrderCountActual>0</ReturnedOrderCountActual> </GetOrdersResponse> </soapenv:Body> </soapenv:Envelope> 。 例如,它应该仅在其容器div的高度

之间保持固定

我做了以下事情:

position: fixed

但是,这并不能阻止$window.scroll(function(e) { pos = $('.container-element').height(); if ($window.scrollTop() > pos) { $(scroll-element).css({ position: 'relative', }); } else { $(scroll-element).css({ position: 'fixed', }); } }); 在到达scroll-element的末尾时变得相对。我该怎么做才能达到预期的行为?

编辑: JSFiddle:http://jsfiddle.net/09760d60/

3 个答案:

答案 0 :(得分:3)

我认为你应该在$(window).scrollTop()&gt;时移除固定位置。 containerHeight-childHeight

Line 1:String x = new String("xyz");
Line 2:String y = "abc";
Line 3:x = x + y;

请检查更新的小提琴 http://jsfiddle.net/PrashantShirke/1u991v1j/

答案 1 :(得分:1)

您应该检查容器的顶部和底部边界,并将其与滚动元素的顶部和底部边界进行比较:

enter code here
/** Called when the activity is first created. */
static Bitmap bmp;
static EditText et;
static ImageView iv;
static Canvas ivCanvas; // We'll be using our own Canvas.

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    EditText et = (EditText) findViewById(R.id.editText1);
    ImageView iv = (ImageView) findViewById(R.id.imageView1);

    // Move this up to onCreate
    Bitmap ab = BitmapFactory.decodeResource(getResources(),
            (R.drawable.ger));
    bmp = convertToMutable(ab); // Initialize it here with the contents of
                                // ab. This effectively clones it and makes
                                // it mutable.
    ab = null; // Dispose of ab.

    ivCanvas = new Canvas(bmp); // Create our Canvas!


et.setOnLongClickListener(new OnLongClickListener() {
    public boolean onLongClick(View v) {

        //ADD HERE ABOUT CUT COPY PASTE  
        // TODO Auto-generated method stub
       updateCanvas();
    }
});

public void updateCanvas() {
    ivCanvas.drawColor(Color.BLACK);

    ivCanvas.drawBitmap(bmp, 0, 0, null);

    Paint paint = new Paint();
    paint.setColor(Color.WHITE);
    ivCanvas.drawText(et.getText().toString(), 10, 10, paint);

    // Everything has been drawn to bmp, so we can set that here, now.
    iv.setImageBitmap(bmp);

    // Removed the "catch" blocks so you can actually know when you're
    // getting errors! Feel free to re-add later.
}

Exemple

  • $(document).ready(function(){ $(window).scroll(function(e) { containerTop = $('.container-element').offset().top; containerBottom = $('.container-element').height()+$('.container-element').offset().top; scrollEl = $('.scroll-element').height(); if ($(window).scrollTop() >= containerTop && $(window).scrollTop()+scrollEl <= containerBottom) { $('.scroll-element').css({ "top":$(window).scrollTop()+"px" }); } }); }); :滚动元素位于内容的顶部

  • $(window).scrollTop() < containerTop:滚动元素的底部位于内容的底部

  • 如果必须移动滚动元素,请调整其顶部属性,同时通过CSS进行绝对定位。

答案 2 :(得分:0)

我认为检查容器和窗户的底部,而不是容器和儿童的高度会更加健壮。

$(document).ready(function(){
    var $window = $(window);
    var $container = $('.container-element');
    var $scroll = $('.scroll-element');
    var containerBox = $container[0].getBoundingClientRect();

    $window.scroll(function(e) {
        var scrollBottom = $window.scrollTop() + $window.height();
        var canSeeContainerBottom = scrollBottom > containerBox.bottom;

        $scroll.css('position', canSeeContainerBottom ? 'relative' : 'fixed');
    });
});

http://jsfiddle.net/bryandowning/09760d60/14/