是否可以固定div的右下角屏幕w.r.t向上/下滚动 [英] Is it possible to fix lower right corner of div to screen w.r.t scroll up/down

问题描述

我想让div在向下滚动时垂直展开，向上滚动时垂直展开，向上滚动时收缩，使右下角在浏览器屏幕上大致保持相同的位置。

I want to make div vertically expand when scroll down and vertically Contract when scroll up such that lower right corner approximately maintain same position on browser screen.

#resizable { 
position:relative; 
float:left; 
width: 300px; 
height: 200px; 
padding: 0.7em;
top:8px;
left:2px; 
word-wrap: break-word;}

div需要是相对的对齐所有外部文本换行。

div need to be relative and Adjustable to align all outer text wrap around it.

$(function() { $( "#resizable" ).resizable();});

http://jsfiddle.net/EYasQ/1/

推荐答案

我能够做到这一点没有使用一点Javascript的固定位置： http://jsfiddle.net/EYasQ/5/

I was able to do this without fixed positioning using a bit of Javascript: http://jsfiddle.net/EYasQ/5/

$(document).scroll(function() {
   var top = $(document).scrollTop();
   $("#resizable").css("marginTop", top);
});

滚动事件侦听器将更新顶部每当页面滚动时， #resizable div的边距。 div将显示为保留，但文本将回流在它周围。效果有点不寻常，但它似乎符合您的要求。

The scroll event listener will update the top margin of the #resizable div whenever the page is scrolled. The div will appear to stay in place but the text will reflow around it. The effect is a little unusual, but it seems to match your requirements.

这篇关于是否可以固定div的右下角屏幕w.r.t向上/下滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！